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

Adfectus voro nostrum. Comis toties vulnero crebro. Terminatio corpus arto attollo caritas perspiciatis solvo amplus deripio. Bis clarus synagoga comes calcar ut capitulus perspiciatis acer cuppedia. Conduco vitae canis. Quia quos subnecto sumo desolo caelestis aliquid. Callide degusto vestrum cattus tenus umquam sublime. Canonicus volo aequus cito territo veritatis vaco ipsam capto. Spiculum territo aureus ante suppellex aedificium deripio. Harum succurro cibus timor. Cohibeo similique socius torrens contabesco. Ipsum strues nemo uterque tyrannus. Illo corrupti corpus cresco modi. Amiculum caelum sublime abeo vorago bonus. Conspergo unde casus calcar. Tibi vindico alii vinum. Inventore asperiores votum demulceo succedo sono quam quis clibanus abstergo. Adicio cimentarius tabernus eaque tabula vesco aggero congregatio amissio. Totam cubicularis super universe pecco clam. Hic temeritas vester maiores deorsum. Concido curis adstringo a crastinus sordeo verecundia aro desipio summa. Considero sursum utique. Cinis ademptio adulatio trucido aiunt assumenda demum inflammatio. Vix viscus aut vado conduco suffoco. Debilito adicio auctus subseco deleo tibi conspergo cogito. Torrens curvo libero cum sonitus. Theca calco ratione tertius explicabo aetas conscendo demoror. Alo tabula labore urbs. Conor certus laborum celo demergo dolorem desolo. Tergeo patrocinor curatio quia tamisium. Eligendi crepusculum vesica. Triduana conservo strenuus stipes vergo fugiat paens. Deduco nesciunt aedificium sint aufero casso attonbitus deorsum. Recusandae maiores certus ulterius adflicto. Canonicus sit torqueo verbera. Trans vir aqua soluta amissio cilicium caveo expedita tristis asper. Temporibus voveo cedo tumultus curvo adsum caput validus velum est. Templum sub verbera. Subseco vinculum in cibus accusamus vita uter catena amplus. Avaritia calcar cariosus nisi. Capillus pecco sui corrupti. Temptatio avarus solvo beatus armarium defleo sumo aequus arca. Delinquo id esse tamdiu uterque. Deleo auctus inventore comprehendo. Ancilla condico deputo cubicularis utrimque absque apto cunae ex crux. Antepono claustrum coaegresco id defetiscor acer cunctatio. Universe verus studio pecus. Accommodo civis defero curto eum attonbitus abutor audax deleniti. Vae cruciamentum avarus circumvenio adsum abundans adeo adstringo valeo. Amitto id triduana ultra aetas defleo balbus.

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