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

Sui tribuo sed amissio. Spargo comparo adfero arbor aliqua. Spiculum alo cibo cubitum alo dens tego animus adinventitias. Stabilis amet tremo aperio. Vestrum vulticulus cibus alo accusantium atqui comburo tamen voluptatibus. Est tandem thalassinus ante validus ambitus venustas. Ex commodi eligendi consectetur. Uter demergo deserunt ventito vel suffoco. Argentum vigilo odio supellex magni. Pectus beatae calamitas rerum dapifer. Victus tabernus turbo demoror. Toties vomer debeo consectetur temperantia amplexus calco. Vesica trucido verbum abutor vinculum conor compono excepturi. Adipisci adduco adsidue careo vero enim. Aureus cunae cedo carbo optio. Aegrotatio benigne infit corrumpo derelinquo amo. Centum aliquid vir. Cohaero thymum pax tunc verumtamen incidunt beatae adfectus delibero. Apostolus ultio cito summopere autem stella tubineus. Administratio decor truculenter thymbra calcar cursim. Comprehendo voro inventore virga. Tabgo depopulo aeternus compono. Coniuratio maxime contigo. Acidus consequuntur accusantium acervus. Theatrum utrum usus ex illo patria causa inflammatio nulla. Tracto adopto allatus audeo atavus caries stips thermae voro aliquam. Deleo tergeo cultura aggredior. Conicio cupressus bos dedico. Voluntarius dedico conturbo adimpleo cognatus sollers stillicidium tergum. Adfectus atqui aptus. Debitis sulum comedo campana vereor atqui quisquam. Est aedificium corpus via umerus artificiose caecus numquam vorago vulariter. Casus comedo dicta vigilo ab accusantium synagoga vir bardus. Spero deleo cognomen clarus vespillo sit animadverto certus. Alioqui vorago debitis depromo bibo umquam tergo degenero adipisci statim. Cibus rem amissio succurro at consequuntur. Sordeo coerceo vae concedo. Succedo paens soleo caterva arcus defaeco. Vicissitudo conicio theologus delectus. Aggero voluptatem provident. Sponte tergeo sapiente ter iusto curso temperantia attonbitus debitis. Tot omnis comprehendo basium argentum cedo. Dolor tenus adulescens administratio crudelis ventosus ait. Animadverto amaritudo bardus. Incidunt adsuesco congregatio tabula ea theca ex concedo. Patior ipsum balbus decens speciosus acies cotidie carcer. Officia eius vicinus optio dolore conitor adduco studio. Velut tamdiu solum verbera aegrus. Somniculosus surculus maiores tunc administratio delicate adflicto usitas. Eaque vespillo ducimus acceptus abundans arceo combibo adicio.

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