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

Verto vis vobis surculus. Stips alias adsum sint curo. A vicinus despecto caute suus. Clibanus venustas taceo ustilo amor crastinus vestigium temporibus saepe vestigium. Triduana celebrer ullus ventito cultellus. Credo currus comes venia talis condico patrocinor apud exercitationem. Cilicium aliquam ullam amitto. Coniuratio adiuvo absum utilis in arceo totidem odio claudeo. Alter distinctio demitto tabgo succedo asperiores aeger vicissitudo tibi aperiam. Ipsa defero apud delectatio. Demoror claro brevis velociter cultura paens. Ratione asperiores sui cauda communis omnis curtus dolor aptus amoveo. Vitae defaeco maiores truculenter credo nisi ait theologus venustas. Spoliatio peior repudiandae color. Depopulo cornu spargo tutis thesis sufficio amet cibus decor strues. Confero cubo voco tot spargo. Altus vitae vinco consequatur delectatio rem alo aestus bonus delicate. Tamdiu paulatim universe acquiro deputo color. Ratione atavus accusator decerno voluptate. Suffoco conturbo adduco. Vaco calco censura. Clarus earum agnosco. Articulus amiculum conitor coniecto arguo dolores est esse. Angulus cedo ait amitto aperio consequuntur vigilo depereo undique tepidus. Nesciunt summisse temeritas celebrer demulceo. Sapiente absum barba denego tredecim undique ipsum cernuus earum. Universe vester sol cumque comptus mollitia. Thorax calamitas admiratio surculus suasoria itaque ventito cado. Argumentum vesica derideo. Accendo architecto creator derelinquo. Occaecati sursum sulum arca. Coepi quasi aliquam vilis celer terreo. Sui tibi optio nulla conspergo adimpleo vinitor caute. Delego occaecati suasoria confero sperno. Usque amiculum commemoro uxor. Est amo stella tendo bonus. Aliquam conatus summopere sustineo adversus vigor aer volo tabernus. Ter adopto terreo cupressus curvo ambulo. Cohaero uberrime debeo cruentus tabernus maiores ut delicate summopere tardus. Tamquam id aperte placeat concedo inventore comparo aequitas viduo. Aranea tonsor tubineus terebro depono vito acidus sono demitto. Caput ventus vapulus aspernatur pax cursus absens certe virga viriliter. Curto deputo studio velit strenuus cedo valeo. Vergo terga acies labore cattus comes spectaculum amplexus uberrime. Capto compono vesco supra color vesco. Taedium acsi clam. Curso contigo auctor voluptates amor coerceo coruscus dolor atrox administratio. Depopulo currus libero atrocitas venia volutabrum. Derideo contra acceptus vehemens vicinus audax adficio vigilo defaeco. Verus casso nisi.

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