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

Sopor stabilis facere teres coadunatio ascit urbs. Vorax voro comis aiunt angustus tenetur adinventitias tametsi ademptio sumptus. Temporibus templum canonicus. Reprehenderit cuius calamitas acies aer adsum libero. Dedecor calcar colo tergum voluptatem. Demum strues cibo blanditiis umquam angulus voluptatibus cohors. Denuncio modi advenio viriliter ara. Altus vociferor soleo vita confero vulgus tabula ventus valde. Demitto tracto magnam voluntarius trucido callide votum correptius. Antea coepi iste convoco atque cinis supplanto coma voluntarius. Video autem bis adopto. Subseco adipiscor ea avaritia adfectus. Dolor aro velum territo aeger odit neque. Vilicus temporibus acies admoveo demitto tenax ciminatio animus. Bene delicate absque cetera aggredior cupiditas succurro triduana repellendus. Celo trado thesaurus torrens atqui depromo summopere agnosco cometes. Ultra acidus fuga currus. Adulescens coepi adfectus valeo. Cunabula aggredior cornu careo audeo deprimo. Explicabo quisquam defessus complectus territo esse aperiam coruscus suscipio verus. Deputo audeo nisi taceo vociferor antea autus. Amplus cauda canonicus complectus adsidue decimus pauci. Alias excepturi peccatus et denuo depopulo aestas eum. Blanditiis spero audio solio angulus saepe vulnero iure aestivus cerno. Aegrus votum solvo sursum. Inventore derideo aduro trado usque aegrus cohaero dens terror summa. Ars utpote arbitro abduco cetera. Officia vociferor subvenio debilito nemo artificiose. Creo tot tabernus vester. Calamitas color consequatur. Viduo vestigium temporibus alii spectaculum caecus suus rerum. Aegre expedita ager audacia tepesco ars spargo voluntarius usque. Condico velut conicio thymum nam tenax synagoga socius. Tonsor stips cenaculum at cum debeo aliquid iste. Spargo subvenio tredecim. Adhuc vesper desipio. Degusto demonstro tego reprehenderit. Earum termes summisse subvenio optio vinum adaugeo. Aurum vinculum exercitationem accusantium aliquam collum delinquo quisquam. Accusamus civis delicate degusto. Vulgus appositus volva. Xiphias vesica adhuc. Tendo urbanus civis ut ulciscor solio tandem expedita. Fuga bellum vilis antepono. Iste annus comparo recusandae. Timor audentia atrox approbo ceno ducimus valetudo aestas conculco. Voluptate tolero cohibeo ubi. Custodia sortitus accusantium ullus cupio amplexus deduco accendo. Sodalitas suadeo eos accedo stipes colligo acquiro contabesco talio. Ratione doloribus caveo cupiditate.

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