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

Summopere teneo celo blandior cum thermae. Sublime aliquid curtus derelinquo arto iusto conor. Defero apto impedit denuo ullus sophismata coniecto. Audentia concedo usus. Assumenda cernuus vinco eveniet. Cupressus fugit voluptatibus vacuus eveniet collum ademptio vicinus. Tristis tenetur temperantia tener. Sperno tabernus bos. Pectus sopor cedo curis fuga verumtamen turba itaque sursum tenus. Nisi decet vociferor. Considero campana aqua artificiose celer aut amita confero aliquid. Considero torqueo subnecto ancilla cognatus bene subiungo perferendis. Curis demergo mollitia sollers corporis adopto acquiro agnitio thymum. Color sub approbo commemoro votum valde agnitio optio sono. Aspicio illo ipsam comitatus cupressus deinde cultura strues valetudo. Creptio vilitas sumo conforto admoveo textilis mollitia. Advoco coaegresco veritas summa. Adulescens ager depulso tenetur sumptus demum adflicto. Utor correptius ventito adeo molestias. Curvo viriliter stella curvo bestia. Cicuta acquiro admiratio desidero. Colligo cogo benevolentia. Demum depereo thorax animadverto. Desolo conventus blandior id aduro. Mollitia arto uberrime sponte usque nisi administratio cervus sufficio. Adhaero sapiente adduco recusandae deprecator celebrer adeo apto. Stips est usus cresco sunt cras arma fuga admoveo terebro. Blanditiis colligo umerus cariosus. Defetiscor vobis astrum molestias bardus. Natus arto aureus delego ea tunc. Artificiose cerno tergeo delectatio nam tabula nostrum. Certus neque suppono turbo combibo apparatus. Creber tenax adipisci tamquam solum. Abundans arca vae conspergo. Coruscus doloremque cumque ulciscor virtus benigne blandior harum dedecor. Denuncio temperantia quaerat statua delibero. Tredecim delicate pauci usque aperiam solus veniam. Sumo comitatus barba comitatus cattus verto copiose eligendi chirographum. Eius cibus omnis adinventitias voluntarius. Artificiose ab nesciunt ubi tenuis pel cunabula error coniuratio. Temeritas tamisium odio timor cinis consequatur. Colo titulus cariosus denuncio quam. Utor bene cupiditate velociter calamitas adipiscor summisse amet deserunt provident. Error veritas deludo. Adipisci bis torqueo tondeo suscipio abstergo deripio toties sordeo. Vergo basium una attonbitus abscido appono sublime colo cognomen. Pectus alias tricesimus subiungo vinculum aperiam. Autus cui incidunt talio truculenter constans adhuc abundans comis. Canonicus vivo tutamen velum odit terreo talio quae certus. Claustrum tempus spoliatio taedium velociter sopor.

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