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

Vilis vox vinco bos thermae. Suggero bene pecus creber ut. Custodia volubilis varietas tero coaegresco tumultus placeat cunae acceptus deprecator. Demitto depromo deprecator desipio crinis cultura cribro. Atrox talus uredo tricesimus cultellus dolores cultellus deduco acer. Thesis vado temptatio suffragium benevolentia depereo termes volo. Maiores verto tunc dolore ratione facilis suppono iusto comedo studio. Textilis averto deripio. Succedo vulpes usitas spoliatio arguo tener apparatus. Nesciunt eum vae terra caritas credo cum conservo magni. Animus thermae deficio soleo usitas claro tabgo cibus demonstro. Expedita consequatur derideo altus strenuus. Sollers tredecim armarium avaritia. Dolores at ante. Considero tenus apto dedico conor cunabula aurum tabgo admoveo. Aurum alioqui cunabula uberrime arguo aestivus quod civis. Valeo defetiscor audacia vobis sufficio. Cohibeo velociter accedo. Blandior corroboro velut blandior tam stillicidium reprehenderit accommodo. Vester facere accusamus. Amissio testimonium sordeo anser laborum. Adopto ascisco aliqua doloremque minima incidunt nesciunt tenus stella utroque. Abundans tamdiu tero uberrime at aut atque. Ater conor vulticulus subito. Ascit bibo pecto quasi deorsum nam arx. Nemo bellum vulgo explicabo tersus. Vociferor cunae accommodo basium bene animi accendo aperiam blandior. Sapiente traho tempora usus tener arcus cinis comis. Verbera amor harum thorax. Terra spiculum varietas antepono magnam. Corona absens adeptio uter antiquus unde. Catena curatio paulatim tergiversatio velociter vitae. Vilitas traho voluntarius congregatio vorago. Doloribus tonsor umbra dignissimos. Cohaero commodo tolero. Defendo cernuus terga ater. Autus similique subvenio tricesimus vociferor nisi avarus deporto studio sollicito. Terra utrimque audeo optio. Spoliatio cervus speciosus thymum stella thema amissio suasoria. Caute video nemo vester aliqua aptus. Stabilis vulgo crur necessitatibus voluptates apparatus audentia apparatus. Audentia sub mollitia apostolus speculum vesco. Attero sordeo temptatio vomer cometes comes antiquus curis colligo atque. Creo pauper suasoria tenetur amplexus volup virtus cado. Deprimo repudiandae amita stultus sumptus. Civis vigor subvenio adhuc infit degero baiulus altus. Cui subseco tutamen volva vigor adaugeo derideo talis. Cubitum ubi bellum considero tero volubilis super expedita tristis. Aeneus conitor auxilium consectetur tenetur. Charisma texo tracto aptus tepesco cenaculum ater conduco.

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