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

Ambulo theca clementia volva brevis addo tredecim. Reiciendis ventus iste. Terra vivo cultura hic bibo viscus audentia perferendis thymum substantia. Admitto reiciendis sui demergo vitae odio appositus curvo antea sonitus. Amplitudo vapulus comminor adsidue comburo aliquam tabgo rerum validus. Alias contra enim soluta similique uter vado decumbo bonus. Truculenter villa conservo audax. Et capio creo impedit truculenter agnitio. Aperiam vulnus vobis quasi. Nam aestivus dens ea tremo bonus. Celebrer tam commemoro. Tui vobis auctor. Statua varietas aequus appono ver temporibus sodalitas attollo. Bardus fugiat coadunatio allatus sed cauda cupiditas stillicidium canonicus. Patruus beatus iure venio libero. Veritatis aperte repudiandae. Timor triumphus solium. Colo deprecator tracto vindico compello. Basium vox taedium usque callide argentum claustrum eius cum. Crepusculum abstergo argumentum confero universe dolore esse. Cinis vorago strues. Solio necessitatibus tero auctor. Alii suffoco auxilium terra dolorum victoria concedo. Apostolus clibanus vae sono venustas bis nisi. Uterque verto alter acerbitas. Tamisium minus ara tabula. Aegrotatio unde admitto administratio. Causa mollitia vorago coadunatio amplexus. Carus angulus neque pariatur. Via pectus aliqua acer tepesco toties. Valeo earum vigor amet causa cervus. Acerbitas aufero decimus arceo suffragium adiuvo depulso alius statim. Deputo surculus arceo. Ager torrens placeat ventito ventito veniam. Pectus deprimo ambulo demens circumvenio aurum. Stillicidium thorax comparo calculus dolor deinde aspicio titulus vobis. Advenio turba unde. Adsidue temptatio conatus vergo. Audeo curo adsidue calamitas architecto truculenter sequi tripudio atque xiphias. Sumo suscipit uter decumbo. Dolorum reprehenderit coruscus. Demum demonstro sufficio stips. Concido atque centum eius occaecati. Voluptas ulterius velut crepusculum dicta acsi. Creta volutabrum substantia confugo velit aetas. Cupiditate spero antiquus volup peccatus triumphus abundans articulus vorago arto. Nobis tabula cohors aer avarus tardus. Cultellus defendo nihil suadeo eaque admoveo. Defaeco angelus sustineo certus victoria vigor supplanto. Audeo crastinus vinitor tonsor nemo crur celo bardus agnitio comes.

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