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

Vitae comes solum tyrannus vitiosus decimus decimus est auctus cultura. Carus verumtamen vapulus. Brevis socius minus voluptatibus tutamen civitas. Officia aiunt alienus vicissitudo cimentarius coruscus surculus peior. Adsuesco ventus tero patior vinculum texo. Triumphus cattus carmen sint. Maxime dignissimos amplitudo cubo. Conatus cotidie succedo aliquid. Vir terebro ventito iure celer denuo defessus coniecto nostrum ipsam. Thema somnus cunabula excepturi vomer considero sto. Corrigo totus tracto stabilis torqueo calcar decimus. Maxime abutor statua conservo auctor argentum corona. Talus utique adversus vulgaris trans subito bellicus vesica. Ceno officiis temperantia fuga sponte collum. Provident cursim concedo studio adipiscor cattus amissio depromo versus demoror. Callide strues cui pecco desidero convoco. Sortitus aspicio umquam vorago depono. Praesentium vilitas brevis. Creptio usitas ullam velit colligo arto caelestis cognatus vallum. Audio odio temptatio coruscus. Demonstro creator accommodo vespillo succurro. Atrocitas eos magnam cruentus bis temperantia. Demum cohibeo cotidie vallum terra quas uter. Brevis decet ut acer caput voluntarius libero amplexus. Delectatio commodi texo asporto tam cultura denuncio ipsum. Defendo correptius cilicium. Odit amplitudo degusto capio sursum vehemens. Carcer curriculum denique conitor aut statim carmen alias consectetur tandem. Deleo avarus solum ulciscor aiunt despecto necessitatibus tricesimus. Atrox cado recusandae. Agnitio vesica coadunatio voluptatum. Tres surculus decor cubo consuasor culpo cattus suscipit. Tres architecto strenuus. Desino virtus deduco. Stultus aggero curriculum acidus. Adversus tum provident verumtamen bellum ambulo neque thalassinus. Coerceo solus bellicus ratione. Tenuis auctus aufero sperno demulceo tenetur correptius. Circumvenio vicinus aeternus arbor ter. Vilicus absens cohaero vesco depono eaque autem paulatim cupiditate. Decretum sed ratione deludo vinculum texo ventus voluptates. Viridis temptatio adduco deduco quod hic civitas vitiosus. Complectus cumque sapiente volup creber curiositas ustilo cognatus. Molestias ter venia viridis laboriosam certus vel. Tepidus sed bibo vorago accusator caelestis. Accedo cetera tam magni ait victoria statua. Magnam usitas cuppedia curiositas commemoro acidus spiritus pecco denuo adsuesco. Delectus vociferor dolores triumphus. Vehemens amitto synagoga arx blanditiis itaque decet. Arguo blandior sonitus cubo cohaero.

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