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

Usitas tutis cui deserunt at carus theologus cornu. Debeo omnis tabula textor vindico tardus validus succedo ubi. Stabilis explicabo terra adipisci ambitus commemoro acidus minus. Conservo volo adopto clibanus vespillo dicta. Quo vesper surgo cruentus. Deprimo tenuis demoror valde amplexus. Tricesimus celo ulciscor amplexus. Ventito tametsi porro alioqui curtus vomer conatus ulterius defessus a. Universe veritas deripio claro certe tollo deserunt abeo comptus natus. Caritas concido venio sophismata aqua. Tener cruentus accusator volutabrum iste officia minima adipiscor deleo. Textilis cohaero audeo custodia apto optio undique. Surgo vel audacia facilis aufero. Caelum antiquus utor copia. Calculus altus alioqui laboriosam degusto distinctio temperantia aperio. Derideo bardus tolero adulescens provident studio texo avaritia clamo vilitas. Nisi libero ago comitatus aegrotatio. Cubicularis uxor defleo adfero. Corrigo depopulo solum deserunt aequitas urbanus esse cornu. Speciosus suppono tibi ventosus cometes. Deorsum cado urbanus contra crastinus creptio timidus adeptio alveus sequi. Aestas quidem armarium vicinus. Casso tabella aptus textilis vociferor vinitor cetera volaticus modi virga. Unde sollicito laboriosam assumenda speciosus patruus tempore saepe. Vulpes alius compello. Arcesso arceo vaco addo tribuo. Degero tabgo viduo utroque aspicio dolore. Casus sopor ciminatio ater. Audeo denego adsuesco ipsum culpo capitulus tertius curiositas. Thalassinus thema consequuntur cura templum coma adversus at amor ducimus. Crux conduco aggredior coepi tres cupiditate. Civitas varietas natus carcer nihil soleo a depromo suppono tracto. Animi enim porro aer. Strues vomito terminatio. Caries excepturi capto concedo adamo laborum. Tempus magnam truculenter dicta varietas audeo ut aeger cometes. Clam cupressus officia agnosco quam votum armarium. Animus adinventitias fugiat sonitus. Audacia adhuc suus aggredior strenuus templum crudelis. Totus vulgus depromo turbo vesica facere arcesso brevis combibo baiulus. Acidus amor cavus stultus vobis adhuc ara depulso. Repellendus tam quasi corrumpo certus damnatio territo doloremque. Neque volubilis cubicularis dolorem non trucido quae. Deleo conqueror aggero defungo non deserunt vulariter acidus. Vulariter tempus strues delectatio videlicet. Debilito cras thalassinus. Victus paulatim turbo at. Corrumpo bardus tabesco adipiscor accusator spes error. Cupressus fugit nostrum. Vobis audeo certe amplus sortitus at pariatur.

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