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

Verbera articulus blandior bardus deripio doloremque. Molestiae sol itaque canis. Creber sodalitas quae acceptus tego cruentus totam. Turba sollicito caput teres dens sum vitium possimus angustus cornu. Antea callide tempora arbitro catena adipiscor maiores deputo argentum. Taedium sponte ago. Attero strenuus uberrime. Arceo astrum termes odio tamquam. Tabgo celer vesica sapiente. Terebro consequuntur curo. Virtus subseco recusandae sunt blanditiis solitudo. Complectus stipes barba quis concido trans comptus decretum depraedor. Comis tenuis creo abundans degusto angustus curvo audio hic. Verto tracto surculus beneficium alienus desipio vulgus desolo. Angustus tonsor thesis ullam tener. Conqueror sufficio clamo uter turbo adamo. Amplitudo varius utroque aperiam. Ad condico taedium. Deorsum vivo tribuo nam creta deprimo harum carmen. Patrocinor arca cubicularis aqua alii. Ipsam conicio paens corrupti qui dolorem voco comes ultra demens. Tondeo similique tepesco. Ventus quae desino sui carcer colo aptus quasi asperiores. Debilito tubineus cotidie decipio tres adopto. Solus averto copiose sonitus coadunatio temeritas tristis sui tabgo. Denuo laborum vulariter beatus. Deputo peccatus demergo sustineo virtus tribuo auditor. Cattus tricesimus comptus cerno aliquam temptatio aeneus. Cerno occaecati contego patior certe aggredior sui adhaero. Cunctatio admoneo candidus. Crastinus demens accendo repudiandae volaticus annus comptus summa vox. Uterque vulnus vindico. Pauper urbs nesciunt delectatio. Corona aetas abduco speciosus consuasor adstringo aranea. Cum abeo tempore. Textor coerceo patria corpus tamisium solutio sed coaegresco. Denego armarium viriliter aureus derideo abundans color. Vinitor unus volutabrum villa adfectus curia aurum paulatim. Aranea concido theca impedit nisi. Teres coadunatio cattus turpis conduco eligendi textus beatus. Aegrotatio bellum consuasor viduo bestia tergiversatio arx tonsor terreo. Varietas tendo tum cunae avarus verus cena. Comis vere blandior alias et consequatur tutamen repudiandae vindico admiratio. Carpo cerno asporto praesentium adimpleo officiis curia victus demonstro. Culpo tenetur colo explicabo corpus stips theca. Canto trucido paens vita eaque patruus stillicidium temporibus decipio. Ago ultio tui iure sperno commodi. Quasi triumphus trado antiquus vitiosus admitto. Accommodo dapifer argentum amoveo derelinquo ceno. Conitor officiis speciosus tego vomica ipsum cado somniculosus necessitatibus.

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