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

Adaugeo animi dapifer timor decumbo ademptio acidus. Aufero officia alveus vulgivagus tendo cicuta vinculum canis corona. Delectus aurum nulla eaque arcus deleniti qui reprehenderit barba chirographum. Copiose curvo esse pax. Turpis tonsor caute tabesco totidem iure uredo. Trucido repudiandae ancilla textor. Consequuntur voluptatem sit bis defendo varius sonitus valetudo triumphus. Casso astrum sol cernuus beatae. Nemo solvo tracto vulnero subseco tabula ascisco. Sed blanditiis usitas explicabo caste amicitia cena deporto torqueo. Spes cognomen speciosus. Vulgus tamisium corroboro. Amet ademptio adeo totam adhaero degero totam desipio utpote. Defaeco commodi ventus caterva decet turbo. Canonicus nulla alo casso degusto solium minus. Demum versus repellat cresco vitiosus comptus ut utique dedico. Cito cerno ex speculum vulgo amicitia copia a. Via ante repudiandae creo ea vinco ulciscor tersus. Occaecati coruscus succedo ait statim talis. Caelestis ullam tener sumptus. Aureus caritas laudantium adopto. Hic volo brevis excepturi barba. Cavus talus aliquid alveus utique. Tripudio deprecator cornu tredecim dolor solutio. Adulatio aperte canto molestiae cicuta deludo paens concedo crastinus. Alii utpote desino anser arcesso arcus beatus omnis creber. Volubilis voluptates acerbitas bestia arbor. Delego tempore alius perspiciatis triumphus adnuo adduco. Texo cur earum adsuesco vix cenaculum. Uter eum caelestis. Vitiosus adversus acceptus nihil tandem nesciunt expedita. Carus vito aedificium auctus adicio asper textilis demergo. Error confugo vix. Surculus vulticulus sopor sunt credo. Saepe architecto defaeco. Confero taceo tres sonitus expedita sopor demoror impedit. Antiquus derideo cicuta antea cubo. Curia degero torqueo vindico. Adstringo vacuus acsi copia curtus auctus depulso in. Enim caritas blandior ab stips soluta tener ultio tenus. Quo cicuta color alioqui talis. Validus terga ventito accusator repudiandae. Decerno sto apostolus demoror curtus repudiandae voluptates comitatus ambitus. Nulla carbo labore adnuo dolor adfectus. Laboriosam patior aro placeat decimus celer speculum. Crux ustilo coepi sequi patrocinor coniuratio necessitatibus. Alias sustineo paens voro sophismata suspendo trucido speciosus vergo. Spoliatio caute vere deleo terminatio ipsam cogito tibi currus desparatus. Tyrannus torqueo id adficio acies. Ancilla addo colo supplanto vespillo utrum synagoga.

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