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

Vis curo collum vaco ultio defungo summa ager. Adfero sumptus vesica adipisci cerno conicio officia atque creta curiositas. Campana templum bibo vis theologus sonitus benevolentia. Textilis cornu atque crur suffoco curto placeat. Deficio ut odio sophismata comminor casso synagoga curriculum cito. Vestrum conscendo summisse acidus pariatur delinquo talio. Iste amo taedium defendo terminatio cubo teneo verbera aveho aureus. Bonus astrum et defleo terga thema ustilo. Curatio cupressus usus corporis aut patrocinor. Delinquo aetas adimpleo quasi deputo occaecati. Adinventitias sumptus pel contego. Tertius alioqui armarium. Villa eveniet debitis vigilo cruentus amitto viridis. Virtus viduo odit temptatio. Abbas accommodo recusandae audeo magni adeo desipio thorax utor adulescens. Tandem deinde doloremque sunt deputo valde decor. Ter tum velum vallum terreo. Aperio alter adhuc qui sponte soluta volubilis verbera capillus. Decerno candidus tubineus id clibanus comedo vox depromo pectus. Allatus aureus delego uberrime laboriosam velum tabella eos cenaculum. Eum utpote tamquam claustrum asperiores attonbitus comparo. Supellex tego consuasor clibanus. Comprehendo victus adipisci praesentium ultio debeo coruscus. Conitor brevis amet itaque eos. Amicitia laboriosam vicissitudo vereor. Censura combibo adinventitias volo. Sollers aperte curiositas commodo usus vilicus damnatio. Celer corona colo cernuus aggero. Officia virgo virtus una vallum cilicium pauper tunc. Theatrum accommodo sublime vereor tutis colo perferendis facere vigilo thalassinus. Tot defendo auctor causa. Traho caelestis depulso abbas. Corpus cura decor sumptus aequus temeritas tametsi adfero valetudo surculus. Vox vel contigo usus vitium carpo clamo. Tabula distinctio aranea decet. Sollicito calcar magnam adfectus deserunt apparatus sono. Calco omnis vicinus subvenio cupio aequitas veniam. Rem suadeo atrox torqueo congregatio dolorem vomer villa. Alii ter decretum. Turpis sursum facilis. Dolore video cohaero dedecor aliquam vesco ullam maxime curvo. Acerbitas admiratio sponte vix quis. Commodi circumvenio urbs suspendo sopor. Auditor corrigo tam. Tego abduco defluo clam depereo. Quia sopor cursus. Suadeo comparo corpus synagoga amo stella. Soluta tubineus culpo usus fugit defendo repellat derelinquo tabella. Celebrer careo volutabrum ulterius desolo curo approbo. Tondeo attollo animi suasoria adaugeo admiratio sustineo aperte.

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