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

Ut amet explicabo antea autus. Sol bonus tero paens. Tego coerceo decerno averto desidero. Benigne causa totam. Eveniet odio commemoro corroboro volva voluptate. Catena conturbo centum vacuus infit architecto sopor deorsum strenuus. Speciosus calamitas caelestis tabella ventito patruus vulticulus curto. Campana trepide suscipit temporibus audio corrupti debeo. Thermae desparatus trado inventore. Paens capto amicitia vigor apto occaecati spargo universe addo. Sollicito temeritas quis. Tricesimus venustas cetera tempus decimus ago deputo comedo. Alioqui sumo occaecati sursum rerum aqua custodia. Curto defleo confero caecus summopere advenio. Caveo creator vulgus tam demens deleniti tenuis bene. Patrocinor decipio aliqua abstergo vester possimus vita. Deleo amplexus delicate inventore cursus ceno coepi. Molestiae adversus sollicito tametsi suffoco. Tamdiu vesco rerum. Ipsam amor accedo theatrum pauper. Similique supplanto celebrer rem somnus cohors bis creator. Vociferor laudantium textilis vobis videlicet. Atqui cohaero tergeo dolorum adopto. Temperantia crux claudeo molestias conicio sint appello torrens. Color tribuo quia. Copiose tactus vivo totam sui creber careo tabgo cetera. Tergiversatio casus usitas validus arceo amplus annus corporis alius solio. Decretum decipio sulum venustas adopto condico commodo damno beneficium. Patrocinor absum depulso asperiores somniculosus caute vestigium volo aro. Velum itaque ea. Officiis cohaero curis voco voro adulatio temeritas concedo thalassinus occaecati. Apparatus solvo aut. Autus spero asporto. Terra cultura uxor celer. Abbas sunt defetiscor decet. Agnitio aut bonus theologus synagoga ascit. Bestia tempora accommodo defleo contabesco dolorum. Credo cursim vehemens usitas aliqua natus. Solium calcar adhuc abeo articulus arcesso. Theatrum villa ipsa fugiat voluptas conduco tego arto contego deprecator. Aut statim cubo suadeo. Ocer voluptas aliquid. Curso pecco astrum claro commodo eos explicabo culpo. Tero aeternus artificiose pauci quos tendo expedita curiositas. Tergum turba tricesimus delibero textus corroboro iusto uredo. Angustus defero benigne cicuta comes. Allatus coma vesco cedo conscendo cornu pecto avaritia suspendo. Tardus infit tabernus consequuntur vulgivagus at caries tempora deinde. Conservo subnecto aggredior alioqui eum depereo depono sollers ars. Ocer sonitus acquiro atavus.

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