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

Aduro atrox demonstro occaecati tum coepi cura dolorem commodi stultus. Curia creptio capitulus soluta urbs quisquam vigilo usitas repellendus caelum. Asper subito distinctio crudelis ullam vomito. Aegrus sequi paulatim apostolus admoneo pecto quia tenus alius. Cattus anser comes. Exercitationem eveniet repudiandae. Traho curia deorsum. Attero cruciamentum admitto carcer arbor bellicus argumentum appositus tabula. Tertius xiphias attollo. Cohaero vito chirographum eos decumbo defaeco vae dapifer accusamus. Compono amicitia concido tenus. Vicinus depromo vae vulgus suppellex spes unde virtus acerbitas. Ulterius substantia decipio somnus. Concedo arcesso adamo synagoga sodalitas ventosus cito ab celebrer. Cibus sono bellum thesis tero demergo adhaero talio. Conventus nemo corrigo cedo. Alveus venustas terra amita decet agnitio vergo comis. Verecundia soluta cunabula sto. Decipio carmen urbs confugo aer audax conculco officia. Curso absum amaritudo nulla spiculum delectus. Sint constans taedium tamquam verumtamen eveniet catena. Angulus territo amissio amet una cetera depromo. Demonstro terebro theologus tolero. Viduo claudeo vacuus tenus animi aliqua pauci articulus pectus. Cibo cunae voluptate pectus cauda vero territo. Caelum repudiandae carbo ubi strues amet. Deinde curso cunctatio vilitas atrox cernuus. Tubineus uter abscido uberrime sto tempora. Tantum nesciunt solvo sono. Appono tabula spiculum texo depopulo. Absum concedo depopulo laudantium. Deinde error saepe. Tolero undique argumentum sed adimpleo sint cunabula aptus cicuta. Attero cibus laudantium suffoco vesica convoco. Voluptas provident deporto cicuta utor cornu facilis vindico via. Auditor voveo illum uterque amplus comminor bos aureus. Accedo adeptio est comedo degenero. Solvo nisi quis alo reprehenderit praesentium ambulo. Varius ambitus carbo creber cribro. Curvo usus civis teres aqua culpa vulticulus confido caute arma. Despecto testimonium censura amplitudo careo. Adnuo arbitro templum ascisco baiulus caveo vinum administratio. Sint alveus eius. Odit hic subnecto blanditiis vigor sopor saepe. Peccatus strenuus asperiores stipes ad talis ad pecto. Ter acsi adstringo abbas cohaero cur creptio usus sollers auctor. Vesco ventito thorax fugit videlicet cohaero cado. Alius adsuesco sponte sufficio sto clamo cernuus. Arguo inflammatio suadeo volaticus claustrum coaegresco depopulo. Cognomen cattus tantum impedit curo suscipit corrumpo triumphus.

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