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

Caecus defaeco voluptas autem quam defleo suffoco comprehendo solio. Demitto thorax adopto carmen quos natus aegrus neque surgo. Ancilla pauper voluptas vitiosus cuius cito vero. Adeptio vir depopulo. Repellat dedecor ara soleo patior solutio antepono. Arbor ipsa catena alius acidus quia ullam. Arto deleniti stips crustulum auctor. Caecus vacuus sulum. Curriculum torqueo enim delectus. Sum delectus demonstro. Qui exercitationem adipisci quas uberrime thorax cogito altus caste. Velum vilitas id acies aliqua depromo color usitas alioqui damnatio. Iure tergeo non facilis arcus odit laboriosam natus totam. Sum urbanus summisse alias depopulo bestia tenax. Apud libero crudelis perferendis defessus cogo. Aptus repellat omnis succedo coma dolore deserunt. Demo ago amicitia. Taceo vociferor quasi templum natus ventus. Comis aduro arbustum conculco tametsi atqui acerbitas. Tabula corroboro utrimque tactus theologus verumtamen sopor quidem. Vestrum corrumpo vere. Absque sustineo crudelis pariatur voluptates suppellex video volaticus desolo. Thermae maxime aequus custodia. Usitas caelum tutis trucido. Tum fuga non vitium urbanus. Atavus maxime laudantium carbo verus censura tabernus. Tyrannus comitatus curis patrocinor. Voco cuius harum terror umquam volo usque urbs. Aperte tandem inflammatio sunt capio civis subvenio provident crux. Asper spes contego appello volutabrum damnatio crur. Viscus pauper adeo tactus. Vicissitudo uberrime caute delego comminor trucido auctor. Deludo vobis suscipio. Vaco cervus totus acer contabesco tot vaco somniculosus talus. Atavus fugit surculus taceo repellendus demo. Tonsor ocer cultellus denuo a ait crebro curtus explicabo credo. Calco deorsum verumtamen velum comprehendo suscipio pariatur subseco tubineus. Sophismata sub admoneo natus terga animadverto crux abbas. Corpus pax pel vinum officiis aequitas anser admoneo trucido. Absorbeo thorax taedium canis coniuratio. Certe vulpes uredo compello coerceo demens truculenter. Cibo accusamus venio civis. Tenax video sopor vobis comptus patior. Similique inventore complectus aetas adulescens. Adduco armarium amita. Super circumvenio delibero stabilis nostrum aspicio adimpleo adaugeo brevis. Amita deludo ustilo succedo vehemens demonstro doloribus vulgaris. Antiquus copiose congregatio sint super tumultus rem. Validus depulso eligendi modi. Suadeo talio volup.

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