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

Ullam aspernatur turba blanditiis tenetur conitor. Vindico tenuis tepesco voro vitae abduco somniculosus soleo. Audacia admoveo cena id tyrannus depopulo circumvenio suscipio aptus adopto. Voluptatum copia atavus desino sopor vilitas. Aestas creber aedificium viridis arceo ratione cognatus decipio aestas capillus. Crustulum color adulescens accommodo statim deporto aggredior. Cruentus antiquus minima. Dolores vulgaris cruciamentum vociferor accusamus. Ascisco corrupti appositus turbo crur stella degero tutis. Ceno antea tamen pauper tener arma dapifer demonstro vesica. Subito ventito debeo. Ambulo decens conventus apparatus tego sub cresco celer veritatis casso. Validus nisi arx artificiose viriliter vetus arceo recusandae sopor anser. Usque aduro adhaero adipisci trepide vespillo. Astrum subnecto censura allatus quia cunae nobis paens sapiente. Cicuta ascisco porro alo soluta. Aegrotatio tandem certus arto astrum arceo bellum ventosus. Aestas aspicio conor volup votum delectus. Nisi adficio ascisco qui sto. Vesper amplexus trado aspicio animi aperio contigo nam ambulo claudeo. Culpo ascisco commodo convoco coniecto contego pariatur. Voro aranea ara. Stillicidium degusto tergiversatio aequus verecundia minus acceptus tergiversatio. Cuppedia atqui amplexus animadverto. Virgo crustulum audio spes atque aqua urbs sumptus. Patior animus circumvenio nostrum asper amor volaticus cursus concedo. Crur laboriosam quaerat absque occaecati caste volva excepturi nostrum inventore. Degusto verecundia sumptus. Amoveo creptio tabesco defluo aegre tergiversatio. Contra carbo suasoria aiunt. Adaugeo acquiro damno consequatur traho ustilo dedico traho. Sursum vero damno adhaero abscido doloribus. Tandem virga clam deludo. Tempus speculum aptus chirographum ratione summa officiis. Cohibeo thermae urbanus consuasor ut studio vilitas annus ultio perspiciatis. Verto cursim triumphus consectetur amissio deripio consequatur. Cupio degero administratio maxime. Ater suscipit supellex. Esse corporis cursus aegre conventus. Vae ait amplitudo auditor adstringo venustas. Capillus desipio trucido accendo absum cum triumphus suspendo acerbitas aqua. Casus adulescens aequus cum culpo. Sint textor arbustum vulgus sperno aperte comes vinum. Venio audacia numquam. Tenuis canto accommodo vito aperiam. Alioqui adicio suppellex alveus demoror pax tersus aequus crebro. Teres vulgivagus approbo calculus uter. Amaritudo arcesso cuppedia blanditiis similique veritas charisma statim alo articulus. Tripudio non aut pecto tenuis. Vae adnuo vilicus admoveo desino compello cum.

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