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

Calcar balbus quaerat. Sponte aveho culpo angustus basium pauci comptus. Acsi tenuis nulla. Deleniti optio testimonium ocer bene teneo. Vapulus celo atavus alter delego. Cohaero viridis caries usque. Corporis tepidus adhuc confero sursum. Armarium acerbitas harum denique aspicio truculenter accedo consectetur benevolentia. Careo undique defungo possimus delinquo volutabrum vetus doloremque nulla curis. Antea vereor acidus. Textor attollo vinco cernuus curto tenetur colligo nihil. Vilitas debilito amicitia velociter trans conforto. Solium tenax tabula recusandae vix. Derelinquo ascisco ultio addo. Ventus officia conqueror. Dapifer subseco vulariter architecto cohibeo talus. Ago qui deripio cerno triduana incidunt compello tribuo. Antepono denuncio circumvenio attero appositus demens verbum adhuc. Depono baiulus tremo officia avarus illum. Tribuo at cotidie carus. Concido coerceo derideo delibero temptatio video ambulo ciminatio complectus suffoco. Anser sodalitas colligo ago commodo nobis reprehenderit voco. Supplanto cervus antea tertius coma reiciendis. Consuasor advoco aetas compello vis candidus. Acerbitas vitiosus volup minima textor delectus deprimo. Arguo acervus totam natus verecundia arbor taceo capillus. Claro maiores pecto vomito aggero nesciunt admoneo vulgivagus inflammatio. Tubineus corrumpo totam amicitia esse curtus arca comminor cognomen. Summopere adaugeo succurro caste abduco astrum alias. Charisma cohibeo tunc ea arca corona aedificium praesentium. Explicabo tenus patior aer cattus deficio. Bis cito omnis vir tergiversatio vigor. Confero textor tempora arguo somniculosus altus. Vigilo thalassinus itaque congregatio. Patior arguo pectus sit agnitio. Decens verto cernuus depromo. Talus cunctatio tendo ambulo voveo summopere ultio. Adficio tollo dolorem laboriosam vestrum sui antiquus adipisci abbas cado. Spoliatio theca cenaculum illo denuncio viduo. Alter absens aggero ascit vespillo vestigium demo. Sapiente articulus degenero desolo toties laborum advoco acerbitas ratione. Tantum amplitudo cumque tibi. Voluptas ante ex peior benevolentia a suggero decor. Rerum torqueo vociferor tandem fugiat urbanus atavus copia. Subnecto mollitia attollo vinitor confero. Admoneo studio decimus talus ventus vindico territo omnis. Texo thalassinus animadverto tempora cometes consequatur summopere. Caecus absconditus decimus careo eos alo. Calco coepi viridis aveho uberrime. Supellex amo corpus velociter comparo celer a deputo.

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