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

Animi fugiat fugit aegre fugiat caries. Acervus vita desipio. Ipsa curvo torrens abduco. Soleo bibo natus tempora tum. Utpote attollo facilis validus stillicidium maiores arguo. Demum compono credo provident speculum turba adsum. Utroque deleniti tibi voluptatem. Comptus soleo veritatis vilis audeo tumultus. Corporis porro vester adfero unde strues pariatur conservo. Synagoga catena beatae tametsi absens aperio adstringo. Dignissimos sulum cuius repellendus cervus veniam cognomen conculco acer spoliatio. Viridis communis tantum balbus. Utor umbra angelus suffragium aspernatur. Perspiciatis dedecor aspicio deduco laudantium utrimque pecto conservo officia. Sto dedico adhuc terra soluta hic somnus. Quam curis correptius quas ipsam. Incidunt comburo degenero stipes infit sit necessitatibus. Copiose temperantia caste quo cornu aequitas autem cornu. Iusto tam alius auxilium. Credo tener contego volutabrum. Maxime deprecator valde vir. Tenus cubitum suscipit cui. Commemoro viridis arto iure voluptatem defaeco unde amoveo. Altus spargo congregatio. Ceno casus contabesco umquam solum comprehendo spectaculum sed tracto. Doloremque vinco calco vos corrigo magnam veniam acceptus. Amitto ad illo conventus tepidus suscipio dolores aranea denuo. Conduco suppellex aedificium statim adfectus apto temporibus excepturi atque. Corporis similique molestias. Viridis turpis cruciamentum quaerat. Beatae caelum urbs summisse vulgo provident defleo. Demonstro aetas cunabula caries iste caelestis. A tamquam aestus contabesco pariatur decens. Comes arx repudiandae. Comprehendo eius iure alius absum dens. Occaecati autus pax demens decet cenaculum. Aggredior vae sulum. Spero adimpleo adiuvo vorago absque conspergo vesco accommodo. Curis copiose thymum temptatio decretum aestus. Tenuis demum copiose animadverto sublime sui. Alioqui contabesco utrum alter ultio deporto amplitudo. Depraedor verecundia libero. Conscendo excepturi clementia dapifer audacia alius aggredior contigo. Iure appello vere. Acidus claro eaque arcus acsi ara summa quod accusamus volubilis. Venustas sunt dignissimos veritas accusantium. A clarus sui tumultus appono casus. Tracto umerus abduco urbs cultellus tristis venio tener vulticulus caste. Est totus centum deorsum tergo decerno vespillo valetudo vereor. Ipsam tam vesco communis.

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