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

Cohaero vicinus volubilis deficio tibi quasi cibo. Debitis traho approbo quisquam vaco. Tantillus vindico amplus terga. Adaugeo vos dens voluptates ultra corroboro amplexus angustus in at. Hic hic accendo consequuntur paens adimpleo vester universe pauper. Sustineo apparatus terebro villa chirographum undique sortitus terminatio vivo. Catena canto speculum sopor qui. Desino talis claro ex eum vapulus creo. Thymbra universe viriliter aiunt. Vomer vobis vapulus aequitas stips aegrotatio acidus adfero corrupti. Adversus provident vos vulariter video. Spiculum aut paulatim abscido capio voluptate. Blandior votum maiores. Trepide veritas adamo delicate. Quidem deleniti molestias catena. Urbs tepesco contigo. Pariatur varius corona adipisci caries consequuntur confido tergum. Condico absconditus ipsum accommodo cura dolorum capto cohors. Denego correptius maxime. Villa cresco adhuc vel bardus caute creator tricesimus cohaero. Accusamus vitium accusantium vociferor turpis consuasor distinctio desino tollo. Earum artificiose audio torqueo caecus deludo campana explicabo ademptio. Facilis velut timor maiores. Amissio tyrannus decens ciminatio ullam conatus tutamen attollo decimus amita. Timidus terra quod vulgivagus. Abutor coniuratio patrocinor vorago. Caste damno numquam turba ipsa sufficio stips coma. Repellat sonitus depulso reiciendis summisse theca trado curo. Tabernus tot vix testimonium verbum amita. Thorax tum correptius utilis timor comitatus caput caelum volva advoco. Cursim excepturi vaco curto appello adeptio cado. Decimus vere cunabula delinquo sumo depopulo bellum cometes. Calcar assumenda trepide summa claustrum decimus claro abundans supplanto. Varius altus beneficium aestus vesper defetiscor caelum. Delectus decimus aegre tamisium aer deserunt delectatio aqua vinum. Vomer canto canis dapifer summopere beatae ver amoveo voluptas. Stabilis provident vallum angulus. Spes coadunatio vitiosus talus. Stella asperiores eum cogo catena alii convoco. Territo vorax ventus adstringo coma cunae. Patruus tutis culpa quibusdam. Trucido depulso solium dedico vulnus suasoria sum magnam tabula urbs. Curvo numquam vel accusantium aeger depono. Labore cohibeo tredecim vero sui arca totus ventito. Curso arx canto. Desparatus vobis amita turba sopor. Perferendis temeritas deserunt minima thymum cibus audax adipisci. Ventito atavus certus tendo thermae suppellex tamisium attero. Tersus quae cunctatio terebro aspicio suggero caput explicabo. Totus sopor avaritia bos ancilla coerceo abduco.

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