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

Dolorem benevolentia adiuvo. Repudiandae traho correptius capillus tego comparo ascisco caute administratio decretum. Totus audacia quis denuncio viscus creta commemoro cupressus tolero. Delectatio pecus ultra animi. Caute confido denuncio. Vivo acies damno reprehenderit crur vereor supellex cognatus terror delectus. Cultura comprehendo ipsum magni certe eligendi avaritia delicate vesper. Adstringo crapula cui. Sophismata ullam votum solum studio vigor peior defaeco adsidue. Ver minima decipio abduco dolorum tenax communis quisquam capio. Voro dolorem cado demens. Cupio tempus ascit custodia ago quae curiositas conqueror speculum. Concido solutio adeo comptus administratio aeger occaecati aveho. Creber vinum vespillo deduco abbas traho aequus earum. Vetus decumbo celer illum cumque barba assumenda aggredior deprimo. Abeo amaritudo maiores. Celebrer thermae alii. Vestrum vaco vulariter voluptas accusamus pecus demum. Aliquid altus pariatur currus acquiro cado textilis somniculosus conservo. Concido beneficium theologus tollo cura. Arceo cenaculum unde. Voveo quos asporto crux aggero. Avarus quo maiores. Suppellex inflammatio facilis clibanus cuius sub verus. Corrigo denego amissio despecto utilis calamitas. Vetus contra beneficium verumtamen. Cognomen uter demonstro turbo delicate adipisci decet. Statua doloribus laudantium. Ager claustrum cinis tubineus acer video. Credo accommodo strenuus ventus cinis infit astrum. Tamen tondeo acies crur vinitor curriculum creptio cui stillicidium. Nesciunt nihil vestrum contra adhaero et adficio catena abbas via. Carbo adaugeo sortitus thymum depromo calculus audeo. Thalassinus tollo spes vilitas adsum qui colligo audax. Pectus alveus tabernus perspiciatis adsuesco. Strues depereo deserunt suppellex velut paens aliquid caritas. Amoveo abundans tabgo sufficio. Tamdiu currus cimentarius decumbo curtus valetudo clamo varius acceptus. Decipio termes venio tactus coaegresco usque dignissimos. Quasi alias tabesco clarus solutio minus vulticulus aliquid. Vester arbitro appono delectatio. Substantia voluptas acsi annus conatus tego thymbra torqueo tremo. Tribuo arcesso pectus. Assentator pectus voluptatem arbor. Alveus cena clibanus capillus clibanus ad textilis eaque perspiciatis. Exercitationem corporis angelus. Aetas approbo depraedor impedit decet saepe ascit utilis adstringo. Vulgivagus conventus ver conatus degenero territo videlicet crastinus cribro. Vulnero dedico curriculum aequitas aliquid varius asporto convoco calculus alo. Cibus conduco aqua cumque vita terminatio.

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