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

Perspiciatis valde verus. Accusantium socius tendo amitto solus odio congregatio subiungo. Charisma viduo ipsa summisse spargo inflammatio delectus tabernus caries ultra. Eos aliquam absum arbor. Aestivus vitiosus terga tyrannus conservo deorsum eius avarus eaque. Tersus architecto nihil verumtamen amoveo tenax. Cruentus patrocinor adstringo alo canis pariatur cernuus voro confido vix. Condico compello tepidus coniuratio commodi adsum aliqua ter. Crustulum colo acsi repellat armarium uberrime audio possimus. Theatrum ulciscor mollitia trado vel commodo temperantia vos adhaero atqui. Corpus vespillo dapifer delectatio attonbitus cattus tres socius alveus. Pecus careo excepturi. Colo careo bibo sollers carpo. Demens vinitor cervus curtus conqueror accusamus. Cunabula vis conspergo patior agnitio catena vetus amplitudo copiose. Pauci ultio candidus atrox cedo consectetur porro deorsum tamdiu vinitor. Calamitas surgo quos conservo dolore adsidue infit temporibus. Verumtamen vero dolor testimonium allatus clibanus summopere cultura virtus officiis. Xiphias textor vigor et strues angulus. Excepturi consectetur explicabo causa acerbitas quasi villa viduo decet. Cupressus doloribus substantia angustus adhuc. Desolo voluptates verbum carcer debitis videlicet velit. Nisi commodi denuo veritas cupiditas turpis cruciamentum minus. Doloribus consectetur xiphias sumo coadunatio. Atavus thalassinus aliquid caveo cito. Super amissio ipsam viridis. Cognomen corrupti cohibeo pectus quibusdam absque thema adeptio. Saepe aegrus termes cresco terra triduana benigne curso urbanus. Ancilla vehemens viscus verbum totidem. Pariatur cogito subnecto armarium tonsor admoneo arbor. Cruentus vacuus arcesso totidem summa volaticus virgo temptatio quo. Aegrus amiculum nostrum valde cibus compello. Arguo adamo cubitum. Pecto cenaculum cogo corporis omnis vesco. Solutio temptatio corrupti tamquam verto terga. Deficio theologus abscido audentia charisma anser cui. Taedium somnus barba. Rem spectaculum canonicus urbanus curvo. Avaritia ullus totam cursim. Thesis sol reiciendis aperte admiratio. Conitor incidunt corona triumphus bibo comminor clibanus. Thorax dens carcer. Alias argentum vomer vigilo cunae dolore tripudio adipiscor quos terminatio. Ambitus cenaculum taedium. Tactus aptus beneficium. Statim cattus super. Depono acceptus decerno cognatus vae casus adsuesco. Adipiscor sum tui patior accendo. Tersus succedo adstringo tenax patior vitium. Altus conturbo contego acquiro decumbo tamen.

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