Tailwind

Core

Provides a variety of globally scoped styles.

Source Page Source

Body Background

Your app's background is automatically set via a design token class. Adjust your theme's color scheme to customize. This affects both light and dark mode.

css 
body { @apply bg-surface-50-900-token; }

Selection

Selection color is also set via a token class. Try selecting the text in the card element below to preview this styling. Notice how selection color changes depending on the background.

The quick brown fox jumps over the lazy dog.

Try selecting the text above.

Mobile Focus

Interactive elements on mobile will briefly show a focus style when touched. Skeleton adjusts the coloring.

Scrollbars

Skeleton automatically provides custom scrollbar styles in supported browsers. Use .hide-scrollbar to disable scrollbars.

Test Scrolling Here

Nesciunt tabesco accusantium aduro expedita. Canto tersus supplanto. Pariatur armarium approbo. Temperantia demergo atque. Bis vespillo utor desolo defendo. Desparatus suus vulticulus trado cibus ipsum altus vinco. Cognatus tam decerno tum accusamus comes auditor. Utpote autus tubineus. Circumvenio acidus thesaurus theca tempus arma acquiro ad voluptatibus. Fugiat vito ipsa. Magni conservo ventito eveniet suus adeo vorax atavus confugo. Damno thymum clamo ancilla coaegresco deputo adfero. Carus amiculum censura libero acer virga colligo conturbo. Cura tendo solio bibo ascit minus beatae aliquam. Vito tribuo annus armarium crepusculum amaritudo molestias amicitia. Voluptatibus amplexus usus. Constans venia sodalitas virga denuo aut allatus culpa tyrannus vesco. Cariosus vesica decretum defluo deprecator tepesco audentia. Comedo crapula comptus. Exercitationem placeat copia doloribus aequus blandior damno conforto esse. Demitto talus abutor verecundia certus denego suscipit paens tempore curto. Voluntarius territo amissio bene tepesco omnis nesciunt venia. Tenuis tempore tergeo ara tripudio cur atque. Commodi labore cariosus vicinus turpis amissio summopere cornu clementia civis. Amo demulceo sum. Campana delinquo utroque. Viridis taedium cilicium annus. Spiculum pecco patruus. Termes vilicus venustas casso adopto aer concido. Chirographum conspergo concido depraedor audio. Arto temeritas ver argumentum cinis suspendo trans temeritas surgo cupiditate. Itaque necessitatibus cernuus defungo super cado cur decerno aestivus iste. Vehemens alter laboriosam ulterius conduco curo torqueo. Uxor optio animi ater tam rerum. Sortitus aeternus tener cupio provident acsi aeneus. Deduco tubineus vado cetera varius advoco calcar confugo. Arbor acies corrumpo venio iusto nisi carpo ascisco commodo adsidue. Corroboro auctor vilis usque trepide tutamen terreo claustrum vicissitudo. Coadunatio crux crastinus acquiro. Ustulo vero derideo caelum vir tutamen. Thymbra cibo amor tenuis stabilis virtus. Impedit capio amiculum summisse tabula ut carbo odit capio. Suasoria creber sustineo admiratio stabilis quis vesica crapula audeo clamo. Aestas volubilis carbo damnatio provident apostolus coadunatio tabernus thermae. Viscus uredo vehemens cado tunc. Inventore denuncio depono socius theca voluptatibus caelestis. Aliquid copia vesica torrens deprimo terreo consuasor sursum cubitum canonicus. Casus sono abduco appositus amet cedo magnam sollicito pax. Canto aduro cito absens abutor. Viscus velum defero.

Dividers

Native hr horizontal rule elements respect your theme settings automatically. Use border size to adjust the width.

Divider Styling

Dividers may be dashed, dotted, or doubled.

Vertical Dividers

Divide columns with the .divider-vertical class. You can apply it with a span tag. Adjust the height as desired.

Left

Right