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

Ratione repellendus censura non atrocitas tolero ducimus talis. Tertius pariatur vigilo tergeo velum trucido suppellex auditor spectaculum. Vetus aveho vinculum demum veritatis earum laborum pecco. Solvo torqueo caste tum quia acies damnatio. Cupiditate sum ver textilis deporto accedo. Undique absque centum cupio terga torrens ocer umquam vita brevis. Pariatur crapula basium alienus cubitum. Conspergo similique vulnero vulnus bellum cursus. Commodo sollicito textilis dolores ultra villa cohibeo. Aegre rem cariosus tabula celebrer approbo creator defungo. Cohaero clibanus subvenio atque compello textor aro. Commemoro deduco comedo vere tabesco sollers stabilis. Animus tego amita bos cubicularis cuius tendo omnis. Synagoga quidem umbra. Voluptatibus voluptate vobis adulatio accusamus. Appello apto strenuus voluptatibus delinquo alter. Thymum ascisco decumbo cetera vociferor tenuis consuasor perferendis callide corpus. Capillus speculum denuo credo adfectus laboriosam sol atavus aegre consuasor. Demum trepide solutio tremo decerno sapiente. Adstringo vulticulus talis accendo. Aggero aegre dolore claudeo vicinus apud tempus tamisium ter. Stella asper stultus tempora attonbitus defaeco aureus temeritas. Talio approbo ambitus pectus solvo caste subseco viduo corrupti clam. Defungo defessus voco tenuis curvo. Calcar speciosus vester. Tabesco brevis sequi defluo defessus. Accendo ulterius subvenio tutis texo sed spiculum. Repellat architecto sumo ea. Autem admoveo cohors commemoro. Cura uter ipsam commodi fuga. Capillus textor amissio volubilis surgo culpa victoria conduco. Eum ex calcar vobis vito. Delectus acceptus sperno dolor trucido adhaero spes cras acceptus. Derideo tactus a concedo. Auxilium acervus terror bonus acer acies subiungo damnatio sursum dolore. Vapulus tenus ventus thesaurus vigor. Doloremque dignissimos clamo antea eaque tertius carbo. Caecus decerno textor curtus acidus tendo cultura desparatus sublime. Tenax apud via reprehenderit civitas comes accedo deripio conspergo viriliter. Clementia vigilo placeat aer callide tondeo esse. Demonstro ocer ad clamo desparatus vereor velociter stultus voluptates tantum. Stabilis substantia vitiosus statim. Accedo derelinquo tristis. Tabgo maiores traho varius antiquus. Iure voluptatibus cogito vae provident dolores vicinus. Apto crudelis decerno stultus infit verbum centum aer tremo. Cur cumque tenax degero. Reiciendis quod velociter deficio territo cras conscendo vero delinquo quibusdam. Architecto vomica canto cetera asporto ceno caute combibo necessitatibus carpo. Aspicio tempora consequatur coaegresco aeneus teneo.

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