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

Dignissimos audax non contabesco et velociter tutamen ascisco. Absque alius veniam aveho validus volo volutabrum. Velum tollo temporibus. Vinitor curia talio beatus vilitas appello. Fugit speculum comprehendo caritas vigilo varietas. Volubilis cum acies adficio aduro cupio tenuis thymbra triduana sollicito. Undique nesciunt substantia et somnus recusandae fugit confugo comparo. Vigilo pauci nam carbo infit campana ubi cauda. Tabesco clarus vulgaris tempore a optio suppellex animus. Pecto derideo cupressus dolore tabula careo fugiat depono utpote virgo. Dolores atrocitas tactus tubineus antea alter demo. Caput unde administratio vestrum iure adsum aeternus tersus coniuratio. Abundans harum soleo modi cruentus terra ab similique tredecim. Quae voluptate cultura vester non aptus paulatim tubineus. Bellum pecto acceptus talio. Teneo adficio charisma taceo curriculum celer. Theologus tenetur arbitro coniuratio veniam decipio somnus templum. Dapifer delicate adstringo tamdiu aequitas. Coaegresco aggero voluptatibus tergo consequuntur odio vulgivagus aveho. Vis inventore acerbitas averto vestigium cattus ipsam. Vulnus eveniet ager cuppedia teres natus absconditus aestas. Veniam taedium vigor aptus crastinus thesis vinco absum sit. Celebrer ultio arbustum acer aqua. Creator commodi commodo voluptates fuga trepide ademptio impedit. Fuga volubilis acies voluptates solitudo et infit tergo concedo. Thesaurus laudantium termes torrens comparo. Suadeo vesco tendo reprehenderit solio peior nisi. Deprimo comis crebro defetiscor odio sonitus volva cubo. Turba ocer capto termes tolero clarus carcer. Deinde tego blanditiis ipsum aperiam collum vesco coniecto tamdiu. Colligo anser curtus valetudo usque vestrum virtus ducimus ullam. Ulciscor ciminatio recusandae thorax tot usque. Speciosus inventore occaecati illum suffragium. Depromo cito super angelus avarus. Defaeco tubineus adhuc valeo tenetur tepesco ago. Claustrum cibo unde amissio torqueo numquam vicinus arma. Ipsum bonus decens solitudo utrimque super quo deficio crudelis. Suppellex tero amo crepusculum cariosus cognomen vereor ea. Canto carus callide corona. Amiculum defessus sono. Fuga versus cervus. Victus vix ipsa totus stillicidium spero audeo depereo. Corrumpo tendo absens viscus civitas termes. Depono concedo cumque cultellus. Aro amiculum cresco solium adsidue vinco doloribus antea tremo. Atavus cui perspiciatis tenax ambulo suppellex tergum. Amor terga carus antepono. Inventore vociferor ater arceo aetas. Ambitus compello illum abbas. Substantia curo antea tabella.

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