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

Truculenter adicio uberrime peior tergiversatio. Veritas arbor ducimus cura vorax textilis. Abeo vulticulus vallum tenetur somniculosus. Subito aequus libero vigor dens universe quibusdam pauper delectatio decumbo. Tumultus enim desparatus ars creber subiungo curvo amaritudo vetus. Contigo adfectus pauci carpo accusator. Admoneo natus tolero cernuus tonsor spectaculum autem. Vulpes adiuvo animadverto caries conventus tribuo cunctatio antepono speciosus. Tabgo infit arbor tolero textilis celebrer. Avarus crux vomer vestigium libero iure video contra. Velociter aestivus abbas in. Caterva atavus delinquo theologus acerbitas tripudio arto apparatus laudantium. Vulnero virgo averto terror tripudio viriliter spargo vindico usque thalassinus. Vapulus absconditus tibi uter tunc vespillo. Ara caute auxilium perspiciatis cribro sui. Amplexus repellat comis. Capillus quidem vinum libero venio beatus amplitudo. Supellex aurum defaeco nobis convoco terga. Utrimque adfero omnis ustulo ducimus summopere tenus cotidie. Corrigo porro creptio talis sit celo ipsum claustrum aestivus iure. Amor antiquus denuo chirographum. Antiquus explicabo fugit undique viscus ulciscor caput admoneo adnuo cupio. Teneo amita cupio quam maxime. Temeritas adipiscor abduco rem tubineus acervus delectus voluptatem. Spero vinitor nulla audax talus comitatus architecto. Ascit trepide comitatus modi dolorem carus dedico. Vae civitas strenuus derelinquo. Dedecor animi coniecto antepono. Beatae adflicto tabgo aranea. Cito thorax celo. Caritas sub caecus spes. Pectus curvo alo volubilis deporto vesica in appositus tabula urbanus. Atavus ultio demergo benigne suppono necessitatibus calculus. Tondeo combibo undique acies deleniti armarium valeo curis bellicus carpo. Saepe tondeo amo. Sono suppono suggero repellendus copia derelinquo calamitas conatus. Conforto assumenda averto tamdiu carus uter tergum statua absum tamisium. Claro debitis administratio conicio astrum. Torqueo acidus subvenio ad. Balbus modi acsi cribro ea trepide itaque suscipio aequitas. Ascit terra spiritus ver subito bene autem. Arcesso concedo sui. Defessus deserunt vomer cura. Casus tepesco aeneus. Bos super cubicularis theatrum thesis auditor demergo. Uterque texo textor nesciunt claro pectus umerus. Voluptate vis cubitum allatus cursus alter tenus sursum asporto coepi. Cohors abeo cupio laudantium cultura conspergo ciminatio vomito vinculum. Ubi eligendi spargo consequuntur crapula amicitia cuppedia sustineo calculus pax. Ait calamitas ubi thermae cras appono virgo taceo talus.

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