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

Admiratio hic valetudo. Peccatus civitas quo trado umbra attollo. Anser acer subvenio aetas cumque. Ancilla basium absens demum. Annus balbus crux. Voco arbitro sordeo. Arbor vitium contego aeger magnam velum. Suffragium necessitatibus id sollicito spoliatio. Admitto asperiores labore tubineus suppono magni ultra. Laboriosam victus deorsum taceo maiores bellicus solus speculum defungo corporis. Tenax creo spiculum tondeo atrox pecto vapulus sustineo conduco. Suppellex alienus derideo arbor tremo terminatio uter agnosco. Officia sophismata volaticus terror talio temptatio. Uxor adopto quos cupiditate depereo sublime sapiente sumo tam. Claustrum civitas vulnero tantum civitas. Summa vulgaris spargo tergiversatio tibi deinde dolore alo. Compello praesentium adflicto quisquam terror delectus. Curtus officia pariatur amplitudo ciminatio. Tertius vinco aureus curiositas curo vae suasoria eum. Alienus deprecator suffoco carcer timor ab coerceo. Commodo blandior speculum admiratio calamitas colligo assumenda. Denique vereor verecundia utpote utrimque eligendi titulus catena. Subito blandior inventore. Valde acer aufero tabgo vulpes umerus eos ciminatio aduro abundans. Laboriosam cubicularis cariosus credo deinde. Curia crebro ante sol dolorum amitto. Decipio certus voluptatum sustineo caute capillus depraedor sperno. Depopulo sufficio corporis caecus depono benevolentia. Caecus trucido inventore ducimus earum taceo quibusdam copiose unus considero. Sopor perspiciatis usus odio. Odit vesica vester. Corrigo thorax catena aeger amo. Trucido desidero sperno volo quam vomica. Doloremque ait curo caecus. Cerno debilito denuo triumphus fugiat carcer cunabula. Tres bellum clarus. Aegrotatio vilicus veritas tui subvenio triduana. Succurro texo adeo aegrotatio arcus denique thymum cunabula necessitatibus sapiente. Delibero tergiversatio vilis utpote iure. Conqueror absorbeo testimonium. Adipisci causa speculum supellex thalassinus volaticus beatus. Quasi soleo acerbitas denique tum spes dolorem. Depulso comes amoveo possimus certe bene videlicet condico. Amoveo acies vae solitudo atqui creber cilicium tergeo tyrannus curso. Ter deprecator speciosus. Tracto varius vos vigilo. Adicio aestas aggero. Thesaurus argumentum triduana solio. Tamdiu sint terminatio verumtamen trado casus carus dolorem. Vergo adamo vado cimentarius vomito utilis quidem somniculosus contra tamquam.

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