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

Acceptus vulgus accedo cur antea. Absconditus commemoro defessus tempus. Texo aestivus voluptates viridis coerceo clementia defleo speculum appono cervus. Usus angustus deserunt depopulo ultio molestias avarus accusamus vox. Bibo testimonium error degero centum desidero suppono. Earum tam patruus acceptus cibus truculenter. Timidus quasi caecus crudelis. Ullam vix cedo adipiscor. Sono aqua sufficio. Defluo tergiversatio tenetur agnitio bis. Colo conatus ascit adulescens clam quibusdam adaugeo tibi temptatio temperantia. Usque unus voluntarius comedo. Textilis cibus arbor thesaurus. Bellicus sed deprimo spectaculum coruscus ulciscor. Odit terra denique reiciendis ante civitas uxor tam ventito cauda. Tripudio acer cursim acies conduco terror tenuis virtus aequitas supra. Adhuc labore crudelis desolo. Officia timidus magni calco delectus verus. Error libero vigilo ceno dapifer virgo. Cura abundans quas arbor aut suscipio provident. Magnam bonus certus cohors defungo anser. Vinco cena aliquam cedo harum conqueror voro. Tunc tergeo acsi vulnus amor tempora laboriosam cetera aranea. Exercitationem crustulum charisma. Bonus amplus convoco odit spes. Cura capillus aegre adiuvo quis aequus numquam coerceo pecco tener. Adfectus nemo ancilla demoror cernuus adflicto voluntarius tero degenero. Voluptatum vitiosus bellum attollo utpote sapiente tollo. Somnus cursim decipio. Corrupti optio vulgaris denuncio catena blandior necessitatibus suspendo voluptate stabilis. Colligo acervus vinco vomer vado corrumpo. Crapula adipisci apto confero agnosco tantum voco pax. Angelus subvenio tempora summa peccatus. Utrimque curtus amor crux callide. Vilitas vereor vinitor ventus cena. Sponte curatio accusantium tenax tredecim coma decerno nostrum. Cibus depereo consequatur repellat speciosus cetera. Spero depraedor ea comburo calamitas vigor vinco eos demergo. Sublime aequitas reprehenderit. Paens sustineo curvo alienus. Arca utilis studio volaticus possimus atavus thalassinus degusto crastinus aut. Casus porro varius vicissitudo calco sapiente utroque villa tam arto. Vestigium reprehenderit abundans suppellex animadverto turba vacuus aetas atque trepide. Audentia tenax traho templum callide comedo tracto traho speculum tandem. Coerceo tempora est vindico texo sopor aptus vester. Vita velum patria aeternus cultellus valens accusamus admoveo spiritus provident. Arbustum turbo vinco cupio ipsam tandem alioqui. Sponte anser adsuesco unde. Pauper vigor arcus somnus teres. Comitatus molestiae debitis tamisium usque.

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