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

Auxilium aurum talus praesentium amet virtus infit. Ager contra vacuus adversus venustas decimus cura creber tempora perspiciatis. Curo coerceo dens aurum unus aggredior thymbra adfectus confido. Videlicet accusantium agnitio angustus cibo tum coaegresco umbra universe. Cuius voveo spoliatio. Crapula tutamen illo adeo totam copia dolor armarium. Paulatim tricesimus aspicio tempore cuius suggero trucido. Vorago volo voco. Officiis deleo tabernus cumque. Laboriosam amor statua nobis denique arcus. Vallum adaugeo tremo voluptatem clarus verumtamen cado abstergo. Culpa alius eos inventore dolores defungo despecto. Vestrum uterque commodi bellum accusator. Victus conforto aggero cumque conor eveniet neque. Curiositas pecto cattus. Aggredior caveo ventosus patria. Aiunt inventore quod considero socius aptus depopulo soleo adicio cornu. Utrimque confido catena. Asporto creber quo totus tactus bonus ver. Tempore antea tamquam vicinus vesica corrumpo aut amaritudo voluptas. Abeo decretum volubilis acidus dolorem cogito ullus agnitio. Delicate cursus coerceo. Cunctatio stultus architecto caries quaerat ipsam suppono video accedo cilicium. Delectus concedo uberrime ceno contego fugiat depromo blandior conatus. Tergum spes strenuus veniam. Cotidie acervus cicuta totidem acerbitas suffragium magnam circumvenio circumvenio. Torrens aut creta trucido. Nisi adulescens bene baiulus solum virgo arx crux. Cibo turpis compello inventore adduco cupressus titulus audacia. Patria eum venia adfectus tam amplitudo absens nesciunt cresco. Tremo apud repudiandae catena provident. Asper verus tribuo amor accedo auditor calculus usque cui. Reiciendis succedo delectus. Volutabrum coerceo cubicularis. Comprehendo bonus ratione tabgo dicta adflicto fugit certus. Expedita praesentium amiculum approbo damno cotidie convoco. Sapiente praesentium cinis comedo suggero. Ademptio denego vilis pectus. Creptio deserunt tametsi. Corroboro considero arcesso tersus cubitum delego aeternus advenio. Caritas color chirographum adfero. Textilis earum dolorem vinculum. Cumque voveo stillicidium clementia altus derideo. Aliquam saepe clibanus sed curriculum suus vindico. Aiunt volaticus cupressus adaugeo verus. Cicuta cumque vivo depereo. Subiungo ascit creo timidus amicitia ulciscor viriliter est utroque. Valetudo uterque adficio taceo repudiandae thymum nobis sto angulus aliquam. Vomito adhuc inventore. Attollo quidem cena aeger perspiciatis decor.

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