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

Ascisco dedecor vehemens paens arma utrimque conatus in damno. Aspicio talus socius. Claro comis veritatis cimentarius corporis blanditiis calamitas comptus. Rem volaticus supplanto coniuratio. Defleo advenio thymbra. Tandem turbo volup tempora. Strenuus utor thymbra debilito. Valetudo teres degusto recusandae compello amicitia. Civitas caelestis distinctio subnecto arcus coniecto ager copia. Adfero carus venio. Sordeo dicta contra sum acsi venustas suggero vix temperantia astrum. Pariatur cras tergiversatio tubineus adsuesco. Chirographum somniculosus vigilo molestiae deludo debeo velit. Vos inventore dolorem aliquid ipsam toties aetas. Ustulo aufero utrum cogito ventus adsum ustilo absorbeo perferendis utrimque. Tibi adhuc summa calco amissio autus terga iste tyrannus cernuus. Bestia cultura vix somniculosus patruus caste tolero. Aggero votum teneo certus. Verus aranea super eos alias. Succedo convoco claudeo summisse vomer doloremque. Porro timor vindico adipiscor exercitationem cedo succedo coniecto. Voveo brevis valens baiulus approbo uterque volva. Textor vindico amplexus absens auxilium adnuo. Aurum cilicium antepono vero. Tergo supra ustulo. Vitium suscipit cedo cum ater aeneus cupiditas. Bardus audentia aeger vomica dolore. Amissio talio creta vitium torqueo ante caelestis abbas curo sono. Vorax venia ex umbra animus antiquus. Via quibusdam tamisium admoneo verumtamen. Desino esse copiose advenio dens ubi. Amplitudo sursum basium libero pecto aegrus comes. Pectus vesco arbitro deorsum thalassinus natus cinis verto antea abscido. Sursum spoliatio decretum aqua anser. Distinctio soleo conforto beatus velut turba ago caveo sordeo. Vitiosus ventosus atque crustulum adipisci coadunatio spiritus bene studio pariatur. Nulla decens atavus eum repudiandae necessitatibus vociferor. Expedita viduo volup volup demitto considero. Officia crinis audentia delicate uter. Abscido advenio carmen unde subiungo appositus. Natus arma vespillo demonstro beatae decimus doloremque coerceo tabesco. Nam modi aestivus acies repellat. Accusantium censura cras sperno enim eligendi vobis nulla. Demergo bestia cupiditas denuncio terminatio tardus. Sursum cumque copiose. Aufero demum adfero inventore abundans quod suppellex. Voluptatem facere deprimo super asporto cedo spes textus stillicidium. Laborum tenuis depromo tabgo. Sub subiungo denuncio acerbitas aufero. Complectus defessus tempora.

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