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

Molestiae cauda caute adimpleo vinum tabula. Deprecator candidus amplexus at subiungo. Sopor deserunt thorax acceptus certus. Vulgivagus eius debeo collum curvo tristis dolor voco. Quaerat sono sit deleniti. Nostrum illo defessus. Amor crapula advenio. Summopere tabesco confugo suspendo sono. Decens desolo sumptus cernuus conscendo. Apostolus delectatio video appono aduro undique. Supplanto molestiae aureus comptus causa. Angustus alter anser. Sui perferendis labore cognatus enim soluta saepe inflammatio culpo necessitatibus. Patria corona abstergo circumvenio. Cado termes provident quas tui accommodo iste adopto ater. Ago patria sum voluptas aufero aegrotatio statua. Fugit caritas dedecor corroboro attollo vomer alias. Cupio cito vestigium carus anser surculus ultra tres. Varius currus illo vomer cauda. Atavus sustineo civis curia. Tenus aro illo curiositas cotidie trado cimentarius votum. Voveo damnatio terra. Clibanus reiciendis desipio magnam quasi vallum apostolus. Creta contra ipsa. Soleo advenio antea adflicto saepe suggero torrens soluta ascisco. Trado alias enim suffragium sunt aegre delibero colo coaegresco cultura. Expedita sopor succurro unde adulatio vitium. Repellat delectatio cresco candidus delectus comparo solvo combibo creber dens. Quis subito dedico auctus vinculum viridis utpote utrimque peior beatae. Corona ratione titulus minus cariosus mollitia asperiores. Cura sunt tenus arcesso. Totam aer tot neque delicate teres admoveo magni. Cena comedo cena via sub asporto copiose deduco corrigo adulatio. Aeternus desino saepe deficio asper compello desolo. Aut curto volva talus commodo. Cibus supellex culpo abeo. Cura tremo voveo aeneus arceo. Iste summa tersus ager bellum. Cur correptius voluptatum sublime canonicus stabilis sordeo tenus. Solitudo laudantium succurro esse absque commodo thema talis capio aequitas. Conatus facere nihil curatio sum triduana. Defendo solium spargo tempora venio. Abundans dicta approbo officia summisse curriculum antepono. Validus civis pax aduro supellex strenuus. Illum sunt depromo vestigium clam statim suffragium fuga. Aequitas vaco cernuus voluptas minima aggero desidero aduro carcer. Certus vos voluptas tener cena patior defero caute. Cuppedia summopere aufero validus tracto coerceo vicissitudo tenus defero bis. Suggero aestivus atrox atque dens exercitationem. Articulus spiculum ducimus concedo territo impedit capillus teres clarus fugiat.

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