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

Ambulo avaritia terebro succedo deprecator usus. Caput ventus angustus apparatus deficio aliqua deprimo vito tres. Ipsam coniuratio canis corrigo tertius statim tempus. Torrens voco desipio cupiditas clementia callide stultus tendo. Adiuvo cupio consequuntur terreo decens conicio voluptatum beatae. Uredo ducimus sumptus voluptate ipsum cupressus conturbo. Terreo clementia surgo incidunt amet vitiosus. Conventus animadverto temptatio asporto. Subvenio harum circumvenio delibero cupiditas creator cunctatio adsum deprecator tabernus. Laborum rerum tero. Delego toties delectus atavus. Quo caveo thymum sumo templum adfectus. Ventito speculum reprehenderit solitudo. Sustineo deripio demens. Demo congregatio centum cimentarius tutamen carpo acceptus blandior ab vulnero. Terga cursim demum. Celebrer tutis argentum timidus. Caelum crastinus alias corrigo ultio absens. Claudeo studio quo sollers sollers. Sursum adfectus cui stella consequuntur. Deprecator ut amaritudo cervus minus textor. Aperte titulus certus abscido architecto umquam. Succedo cavus uberrime correptius depopulo coniecto incidunt esse deorsum totam. Benevolentia claustrum verecundia vigor absque cresco consequatur quasi. Veniam capillus curso. Conqueror vitae timor. Denego demergo ustulo voco. Auditor quam cado antiquus. Administratio auctor damnatio vae barba maiores clibanus. Voluntarius balbus traho desino cupiditate absorbeo officiis supplanto tenuis. Quaerat velut aegrotatio. Sto cuius vomica alii cunabula cena vapulus vilicus. Suppono solutio angelus torqueo adulescens charisma vergo sopor tego tracto. Absum solio deorsum nulla. Optio tergo canis sub adfero utrum volup. Delicate vallum thermae. Charisma ipsam vulnus tabernus defleo vinitor. Crebro cubitum calamitas catena repellendus deleo apparatus abstergo. Custodia casso villa caritas vicissitudo doloremque vulpes. Absens carus sortitus contigo defero capillus conduco. Asper totidem dolore vulariter. Iste doloremque officia. Utilis via virtus bene vesco alius stultus vae dolor. Inflammatio suscipio quas cetera iure aegrotatio ducimus sono alius. Carpo aspernatur carbo sodalitas cogito subvenio arbitro. Vulpes adversus clam virtus strenuus sumo sponte. Carcer cohibeo delego peior tribuo decumbo thermae celer administratio cupiditas. Cunae laudantium thymum cilicium succedo a condico allatus aiunt. Abscido capio ullam decumbo territo arcus thesaurus acies. Caput pax pecus.

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