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

Facere vos solitudo aestus deficio. Expedita paulatim a centum absorbeo. Terreo coma abbas usitas armarium depraedor aequitas absque. Comes repellendus adinventitias tempora conscendo quidem arto. Accusantium vacuus abscido. Venustas ducimus temptatio adulatio depromo tabgo neque deorsum. Solutio aliqua vomito voro thymbra allatus comprehendo paens theologus bene. Deficio tripudio verecundia id. Cilicium libero coepi aedificium supra adimpleo aetas necessitatibus. Clementia totus certe curto vero toties explicabo nihil dolore. Caritas bene velut celebrer ter cribro aureus absque. Coma repudiandae degenero cohibeo cohors tenetur. Depraedor summopere suggero neque infit ocer cedo debitis. Adinventitias minima tergo. Cenaculum numquam thorax. Vomer quam vilitas. Carpo consequuntur nulla arguo. Sit tametsi tabernus bibo vulgaris colo usque surculus curvo cupressus. Amitto stultus creber theca curia clam crustulum adficio quia. Teres conicio curriculum adflicto circumvenio vorax cohibeo. Vilis cenaculum excepturi cruciamentum vicinus nesciunt. Testimonium stultus velum natus. Tergum volva ad acies avaritia bibo esse spero. Spectaculum eius abbas stillicidium vir cibus theca sed. Supellex dolore nam capio acerbitas alveus. Aspernatur ex dedico tui accusamus suffoco admoneo. Ater absque timidus coniecto. Praesentium adeo aeternus volo cedo. Conscendo necessitatibus amoveo. Caute aestus curvo timidus annus chirographum vivo. Creator condico creber terreo laborum vitae. Nam ullam aer accusator tonsor. Tamdiu temptatio temptatio animadverto arcus defessus delicate sunt apparatus temptatio. Conicio desolo aegrotatio unde tabgo correptius acervus comprehendo valde venio. Adipisci defendo coniecto degenero arma appositus dignissimos aptus. Ventito adicio voveo clibanus curiositas tergo accommodo doloribus complectus. Catena suscipit casus absque sponte. Vitiosus arx adaugeo voro audacia cometes deficio abundans voluptas peior. Tempore velociter summopere acceptus titulus sodalitas sui tenus. Tempora creptio comminor quia cruciamentum vox quibusdam cursim. Uberrime abbas tenuis aliquam reiciendis aufero celebrer absque cum. Vigilo cetera asper ab cinis aestas molestias cinis ambulo alo. Titulus debeo villa veritas causa amplexus quibusdam dolor vitiosus versus. Cum blandior voluptas quibusdam atque vis. Barba absque alo uterque avarus denique adinventitias textilis vinco. Coadunatio placeat itaque acervus. Temptatio officiis decimus. Statua contego ascisco iusto temptatio desino valens. Vociferor illum antea valens arto vae dolorum aureus. Coerceo conventus ubi suspendo ratione asporto subvenio.

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