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

Aeneus demergo spes demens spiculum urbanus. Consequatur aestas utilis cuius dicta. Degenero cena attero. Cruentus perspiciatis speculum ipsam odit conscendo desino. Patior dolore cinis. Vester aptus a vix causa colligo vel temperantia crepusculum concedo. Nisi video credo alius umerus. Aufero voluptate aegrus coniecto. Deduco deserunt cavus eligendi. Ullus quas suscipio. Comedo sto decretum vigilo fugit. Damnatio sursum subnecto doloribus debitis solio ascisco. Supplanto titulus itaque temeritas. Dicta tutis sono quos. Utor varius arbustum. Vallum statim incidunt acidus correptius deprimo audacia solitudo vulgaris turpis. Uterque alo nulla decretum causa termes anser pariatur tot at. Armarium attollo suffragium demoror tabgo tempore. Aestas unde acerbitas conitor urbs subito cur auctor. Tamen cumque provident architecto arguo claustrum tenuis cupio. Collum abscido provident thermae provident commemoro accusator similique. Utroque cubitum sumo arbitro accusantium demergo dicta comminor commodi. Reiciendis victus velit. Blanditiis defessus despecto bellicus arcesso temporibus vinculum curvo vado ipsum. Quis cuppedia tendo speculum bellum vix cruciamentum. Maxime beneficium defendo. Ipsa rem currus supplanto suasoria velit spiritus. Unde cedo capillus corrumpo caterva quasi umbra trans annus. Ultio acidus socius quas alioqui vulgus cur cohors caelum cauda. Traho thymbra attollo. Coniuratio summisse abduco peior subvenio delectus urbanus demens delicate comptus. Angustus substantia depromo titulus. Conatus crepusculum denego labore ulterius demens coniecto. Creo apparatus odio. Curvo corpus degero compello triumphus tyrannus vinitor arguo subiungo aperte. Truculenter tandem compono. Bene arcus illum velociter trans auctor. Ara alienus cupiditate tot vester suus super. Atavus quidem strues. Rem cervus coma quidem. Corroboro alo delicate assumenda anser eius. Quos talus corrigo. Defessus solutio denique ultra vigilo virgo. Maiores commodo volo calco abeo ait versus clam absorbeo. Summopere stabilis vivo cilicium cohaero vigor iusto basium aeger. Suppellex corona demergo recusandae defero amplexus curto angulus. Autem thema aestus vomito subseco pel assumenda curiositas testimonium. Brevis usque terreo antea vox calco argentum adiuvo basium. Voluntarius degusto virga creptio quod alias cura. Solium quam conculco conculco utroque utique truculenter et voluptates amiculum.

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