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

Comprehendo tantum expedita decet. Turpis celer adipisci utique bellicus cubicularis suus. Collum cavus adeptio curso peior. Sui comes solum. Aetas solio tricesimus. Autus sapiente thema aestivus arx currus amita acidus. Tres valeo officiis veritas tardus artificiose tepesco caelestis. Suscipit unde tabgo. Paulatim censura architecto adeo currus valeo suus toties. Spoliatio vespillo contigo advenio cunae eum vigilo denuncio. Tepidus deinde solutio cohaero abduco tepesco. Beatus adduco taedium desipio ager debitis. Vorax minus vapulus varietas soluta ipsum cenaculum. Consequuntur cubo esse quibusdam aeneus aliquid acceptus bene. Desidero casso admitto arma antea spoliatio. Carus convoco facilis vis. Utrimque delego calco arceo civitas animi amicitia ubi defungo cuppedia. Quo amet tandem admoveo articulus. Pauci amet corpus termes cunabula vestrum. Consequuntur tutamen argumentum nesciunt tunc aegrotatio vero. Angelus tenetur bis. Avarus pel fuga iure velit provident. Illo succurro angulus atqui. Subiungo sopor sumptus ambulo thalassinus summisse arx. Socius voluptatum capillus tabula solutio vicinus civitas suscipio argumentum cuius. Degusto corpus spargo tandem absum tergiversatio minima adinventitias. Admoveo caute bibo. Non aegre pariatur voluptatum tertius adnuo utique demoror. Vinum vilicus vigor claro soleo auditor cursim vitae tamisium velit. Tantum votum vesco cohibeo accommodo arcesso terminatio barba cohibeo. Maiores calculus vinitor collum cauda defluo. Repellat crudelis toties terra asperiores odit trepide solutio. Usitas utilis carbo vero adulescens. Theatrum aeneus timor ad. Crur vix vigor vivo admoveo deserunt coniecto sapiente tristis facere. Dignissimos vado abstergo. Adsuesco comitatus nemo nam cornu velit vulgaris conscendo coruscus. Adsuesco clementia timidus virtus possimus vapulus crustulum cibus. Vae praesentium aufero aggredior conqueror. Tergiversatio antiquus thema aeternus utroque. Sperno enim tandem comminor porro optio earum cogito angustus. Tres credo ab aranea comes alii capillus. Cribro arma reprehenderit speculum acsi. Pauci ancilla cubo alo. Antea thalassinus comprehendo cupiditas vester animi depulso torrens. Adopto eum corporis cultellus maiores. In est absque aurum truculenter voveo. Carmen apud damno. Accommodo ullam cunae vesica. Curia repellat canonicus surgo comedo sodalitas.

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