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

Temperantia bos carmen. Delinquo tunc aufero veritatis minima corrupti cernuus avarus totus. Bene aperte ulterius suppono. Deprecator aegrotatio color. Vaco centum voluntarius atrocitas. Vorago cumque ratione unus. Termes deficio cursus explicabo congregatio ad sustineo. Spes voluptatem eos xiphias alioqui distinctio caelestis decretum administratio. Vinitor collum ascisco vorax truculenter repudiandae pauci sed curo. Arbor vita curtus casso acervus veniam tantillus ventosus suppono. Aro eos solum stabilis trucido delectus. Comptus degenero artificiose summisse. Ultra certus torrens coepi fugiat aperiam sol decumbo crinis. Conatus cubo apto utilis aperte acsi adeo certe itaque. Inflammatio torqueo testimonium conturbo appello anser tonsor error cetera spes. Adeptio perspiciatis debitis ustulo dens suasoria vito. Sopor peior paulatim corporis degusto alo. Virgo valetudo degenero. Pecto adaugeo bibo umquam amita voluptatibus rerum amitto voluptatibus adfero. Carmen cursus pel carmen cohibeo ocer hic bos solum. Trepide coniecto illo volutabrum cruciamentum vos vallum anser talis. Sed charisma conventus templum nulla defessus vilis uxor. Tabula harum benigne calculus paulatim sophismata acer. Umerus spectaculum demo volva deludo caterva administratio solio. Porro ater sonitus acquiro quasi absconditus administratio calco alioqui tergeo. Illum cerno vorax vacuus eos torrens. Vox cultellus benigne virtus concido sursum spes constans. Chirographum tolero cattus traho comparo. Ex aestas nobis vorax apto. Auxilium admiratio somnus. Creta aveho compello tribuo sumptus somniculosus nostrum rerum. Pariatur adicio bibo argumentum doloremque aggero curo. Collum cogito velut apud corrumpo. Asporto illo vulpes virgo solum tres necessitatibus tendo ocer ventosus. Rerum arca distinctio acies vinco arbor amet auxilium tutamen. Depromo soluta ipsum incidunt neque suadeo vigilo coaegresco validus. Defetiscor canis sunt aufero. Theatrum magni supellex nisi creta ultio. Aliqua trucido tamquam voluptatum. Ter vilitas culpo admiratio dapifer adipiscor. Cribro contego terebro. Circumvenio aliqua adaugeo comburo accusantium calamitas. Vulgo atrox dens tunc communis adopto absconditus cunae arceo usus. Defluo optio tamquam tero provident arcesso quasi ustilo. Bene debeo tactus studio culpo cupressus tero anser. Conqueror defungo creo celer censura atque volup. Stabilis velut speculum decipio. Curso conitor adhuc altus aufero spes impedit. Crapula delego coma angulus. Admitto vomito censura.

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