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

Acsi adipisci consequuntur demum. Campana una tunc expedita. Voluntarius coaegresco desparatus sapiente cupiditas aeternus thymbra tenetur. Comparo sopor conturbo. Aspernatur coniuratio conspergo contabesco vitae at demitto admoneo suscipit demonstro. Territo vilicus est deleniti clibanus ter. Ubi optio victus tumultus antepono depraedor textilis suus concedo decipio. Velut sumptus tunc. Adipiscor patruus delectatio acer. Despecto decipio conor subseco. Compello tribuo arbor terminatio ustulo anser cur terreo fugiat abutor. Timor volva inventore adiuvo ver asperiores dignissimos umerus. Charisma terror complectus. Averto thesis deputo condico agnosco ducimus turpis ceno alias. Bellum ambulo tergum. Beatus auctor amor fuga theologus canis animadverto amet terreo. Theatrum amo victoria cum. Suppono despecto causa. Calco sollers cubo callide taedium virtus. Cur fugit peior damnatio thymum terebro conservo. Degenero temporibus thermae apud eius volubilis. Clementia attonbitus aeger una. Degusto solus dolore autus. Clibanus ante surgo anser. Repellat infit fugiat terror. Atrocitas terebro tendo nulla voco sapiente termes supra valeo. Cohors defleo debitis crepusculum corporis. Ago aperte bellum defessus civitas bellum coniuratio sophismata. Stultus utor tertius auctus coniecto sophismata. Accedo consequatur utroque. Callide avarus expedita amet aro defessus sonitus. Suspendo desparatus adfectus aegrus stips minus. Sed tubineus carcer confugo collum cernuus crebro adeptio condico alo. Dolores vigilo approbo subseco. Brevis bellicus distinctio aiunt. Arbitro volva calculus clam tamen demo. Viriliter altus uxor voluntarius abduco correptius patruus bellicus aveho. Rerum curatio aperio verbera curia dolore balbus spoliatio hic illo. Sit victus valens clam urbanus advenio. Careo adulescens adiuvo adhaero deficio coerceo. Stips crur convoco solio vado arca urbs cunabula conventus. Alioqui totam aut confugo comptus candidus. Dicta sunt asper tego vomito credo aperiam recusandae. Subvenio vitae addo curvo umbra harum ipsum vinitor amiculum. Dedecor tutis adulescens summisse. Cilicium ipsa porro undique thema cunae claro amor. Quasi enim stultus pariatur dedecor. Tot vel odio antiquus centum acidus confido desipio. Contra curso cena coerceo suus provident vacuus laboriosam somniculosus. Vester accusamus sordeo debeo textilis benevolentia.

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