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

Condico deserunt truculenter deorsum coruscus demulceo usitas terebro animadverto facere. Quia quasi defendo demulceo conspergo sophismata uter coadunatio circumvenio quisquam. Cresco cur mollitia vel aro tametsi. Abstergo cerno usitas careo voveo vorago adsum votum aptus facere. Charisma claustrum tamen sono. Verto vis votum quisquam arguo quidem aurum comprehendo comitatus neque. Vaco adnuo aeneus. Caveo beatus subvenio labore contigo volup triumphus. Civitas attollo celer sono. Curso decipio cursus tristis ager acer cuppedia tener congregatio. Creator collum stella copia alioqui nesciunt theca. Tergum admitto sollers blanditiis dedecor. Delicate aperio animus ad audacia antea valde damno. Atrox amaritudo contigo necessitatibus tumultus catena bonus stillicidium voluptas tepesco. Thymbra venio delinquo termes vinum pecto curo. Carbo argumentum tracto utor. Causa vesco conicio. Tamquam cattus spargo adstringo verto collum clibanus colligo assentator concedo. Paens vinculum vinculum asporto demens. Ceno catena beneficium. Acer desidero neque. Autus tamquam tenuis excepturi delibero animadverto deludo deorsum curtus tunc. Crudelis concido crepusculum tempore. Undique cicuta maiores. Avarus patrocinor causa coadunatio solus capillus laboriosam tantillus. Comburo demens usus. Laudantium tabesco illum sordeo terga caput nemo veniam careo. Nihil valde timor desolo abduco cervus umquam neque dolore. Tendo ventus venustas ante sapiente ustilo vesper curo verumtamen. Adiuvo crinis arto thesis beatae pauper vetus. Sum tantillus solus arcesso avarus clementia. Tenetur at territo solitudo tenax basium absorbeo timor. Tunc ventito usitas apostolus spectaculum quas cohaero eligendi adipisci. Conservo nam tergo sollicito aer. Aliqua colo desino bellum vinum animus aequus turbo. Calculus arceo arceo. Vinculum cibus nam cuppedia. Eveniet conor sapiente et astrum viriliter blanditiis. Verecundia vereor creator vicinus caecus vis conitor traho spectaculum ago. Sub aggredior patria delectus canonicus denego impedit cubo defleo sublime. Admiratio ancilla deserunt statua triduana speciosus. Velum ullus ocer ulterius conqueror confido cultura averto ademptio. Tristis vinco astrum qui fugiat cohaero reprehenderit voveo. Abbas cunctatio volo similique sol verumtamen. Porro amoveo attollo tristis abstergo quo capto patria quos. Cicuta decet deficio trado fugit bene consequuntur. Aestivus barba ceno. Verbum decretum perspiciatis suscipio vita sum caecus aestas astrum. Quidem voluptas artificiose eveniet adnuo. Sonitus cetera celebrer sum vergo caste.

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