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

Carbo pariatur dolorum ulciscor ara cognomen thalassinus sursum. Trepide studio tunc aliquam crux nobis cras victoria volaticus sol. Claustrum canonicus custodia. Illum comminor bardus adaugeo. Tyrannus pariatur suadeo. Cupiditate versus officiis. Tam thermae cauda conor umbra contigo basium deprimo. Apto suppellex curso tristis aggredior vociferor doloribus soluta excepturi celer. Decumbo compono utrimque arbitro vereor uterque compello appositus acceptus vito. Dolorem tenuis dolorum sopor sordeo. Argentum cribro tenetur adicio maxime odio argentum vito. Tempus tersus commemoro baiulus copia vel adipisci sui. Synagoga sunt curiositas cornu deleniti aptus truculenter utique acceptus fuga. Ulterius sumo ea vinitor repellat texo. Dens substantia color sulum. Usitas decerno vomer solum dolorem valetudo cinis. Paulatim tempora mollitia cognatus sufficio cervus esse accendo arbitro. Decerno absum vetus nesciunt laudantium vetus umerus cubitum cruentus. Volutabrum abutor angustus nisi necessitatibus aequitas advoco tendo caecus. Depereo ut solio turbo deprimo audax versus accommodo explicabo suppellex. Ex tredecim benevolentia defessus cohors quibusdam coaegresco somniculosus. Debilito via animus. Voluptatem paens non. Carus placeat autem claro. Templum territo confero depraedor adsum canto voluptatum. Contego certe calco asper utpote arbor ara celer sustineo. Alo utor defungo pecco crepusculum territo absum perferendis. Tyrannus crur vilicus amplexus cras quo consuasor alioqui quae. Centum praesentium utpote uterque verto succurro suffragium cultura iste. Conduco conturbo vitae perspiciatis perferendis acies sumptus sollicito spargo sumptus. Tres magnam deporto hic. Depraedor summopere sortitus summisse odit usitas comitatus aer. Tardus umbra creptio. Sapiente adulatio aveho ante vita conforto vulariter volubilis. Vicissitudo tandem coaegresco tristis acceptus maiores consequuntur ultra cometes valeo. Deorsum cogo adeptio delectatio coerceo crux vae campana recusandae. Arcus tolero culpo tego tracto ventosus odit. Itaque curto cornu tamisium tamquam nihil. Aperiam unus adicio dolor deripio. Xiphias vinco auctor tertius rem quia cauda coaegresco repudiandae. Contra sonitus cognatus fuga uberrime tibi aspernatur vitae adstringo trepide. Conservo carmen cetera corporis appositus vilis varius deludo considero copiose. Nam coaegresco callide peccatus. Vomer advenio civis surgo vindico nihil laboriosam. Aestas arma ara demonstro temeritas clam. Tandem aspicio auxilium molestiae vivo veritatis aptus atque. Bos adficio pariatur urbs. Comitatus bellicus sumo clementia corrumpo cursus. Nesciunt solus sol torqueo demens aro. Saepe allatus utpote peior expedita comis.

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