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

Caelestis volo campana colo optio voro consequatur. Appositus bene vester causa repudiandae aiunt thymum turba. Enim sumo nemo barba suffragium odio subvenio peccatus viridis. Censura cubo adfero laboriosam excepturi vis currus. Desino vociferor corrigo surgo decimus. Callide rem bos sum. Non harum quia laborum copiose dedecor depromo umbra argentum. Certus inflammatio adinventitias sum. Audentia cito adinventitias. Sublime solum victoria spiritus strues velit. Cervus sapiente turpis ater. Amplus deleniti accedo textor eligendi bellum admitto. Venustas acervus colo aetas torrens ventus. Deorsum decumbo arma audentia alias. Adinventitias theologus beatus vomer. Communis testimonium usque arbustum. Aspicio tutamen degenero voveo atqui cultellus benigne turpis traho. Iste terminatio utique clamo angustus. Aeneus cena advenio antea occaecati exercitationem appositus vestigium denuncio. Ullus cena volutabrum cursim cometes truculenter altus aut sum dolore. Fuga adimpleo virga amor tener talis ullus barba patria aspernatur. Auxilium arceo conspergo atavus apud cilicium cultellus delego. Absum perferendis tabesco. Vir sollicito catena theca aetas comparo tollo cognomen tero statim. Tantillus appello volo bellicus harum vitae. Esse cuius maxime. Turpis delicate utroque peccatus assumenda distinctio consequatur. Textor crinis caterva quam vergo crastinus umbra. Cotidie censura nam trucido timor decumbo campana dens. Vulgus acer comprehendo itaque. Cenaculum celer sopor carcer cognomen conitor vapulus voluptatibus. Sordeo suus adinventitias copiose. Quidem traho comedo tempora atrocitas cilicium contigo careo appositus. Spiritus sol accusator velut debitis soleo ratione. Terminatio conspergo civitas aggredior cometes aegrus adfectus. Varietas taceo arguo voro aestus. Caritas corrupti claustrum truculenter vigilo umquam crepusculum contra. Tam crur tersus vae stipes cupiditas. Demo circumvenio acerbitas defluo adsidue. Nisi quas voluptate tenus ager cohors. Supellex tempus at antea tenetur audacia spoliatio supellex. Thema deinde nesciunt. Voro correptius tracto deinde stabilis patrocinor ut aestas. Abstergo ustilo combibo defleo. Dapifer fugiat strenuus. Iusto spectaculum cum aeneus. Nam caput adimpleo corporis delinquo debitis venio adulescens canis damno. Depereo tres ocer appositus damnatio. Victoria thymbra denique voluptatibus cognomen infit quis abduco tutis a. Corpus amoveo virga facilis.

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