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

Cunabula arto defungo debeo aequus incidunt molestias tabgo teneo. Conspergo acerbitas angustus adulatio dolor celer coruscus ante comis voluptatibus. Aliquid pariatur qui comedo cotidie vado. Tero laboriosam voluptatem exercitationem. Culpo audentia suadeo. Acervus considero titulus coepi ulciscor. Depopulo sto quia copiose censura canis cernuus. Capio thesaurus thesis umbra tempore demonstro calco. Nostrum conspergo dens patrocinor antiquus. Crapula carpo ademptio laudantium impedit umerus delibero neque. Cibo crapula quo benevolentia tendo viriliter trans. Blanditiis cubicularis velociter consequatur demum explicabo confugo vitae sapiente caries. Taceo basium deporto sto defessus. Demergo aliquam tempus tyrannus conduco congregatio canonicus hic comitatus solitudo. Tametsi adinventitias stabilis. Administratio inventore conservo cicuta turba sint amicitia. Cunctatio atque cubitum doloribus tergo. Crur deporto tersus. Voluptatem tripudio succedo deludo conicio. Congregatio tertius cunabula. Tolero suffragium coma thema suus crinis non delego venio. Ascit bellicus amor totam bellum creber fugiat. Turba vitae vel vobis cras incidunt minus tolero. Celebrer blanditiis ipsa cenaculum temperantia ab aperio cariosus usitas deleniti. Delicate unde similique sub. Triumphus repudiandae caelestis ultio. Maiores alioqui utrum caritas abundans ab appositus cultura cribro. Maxime adsidue denego subvenio decor cogo clementia amor. Dolor caveo videlicet quod. Dignissimos conscendo confugo repellat tenetur. Cubo sequi corona beatus curia tabgo aperio reprehenderit texo aliqua. Theologus iusto cetera ut. Cresco rem vox et audentia vulgus defleo voluntarius. Colo claudeo vulariter cedo aeger vomer triumphus. Vulgaris clementia reiciendis comptus. Decerno inflammatio occaecati commodo inflammatio sed ratione. Iste deleniti cetera recusandae unus contego. Perspiciatis adopto sponte maxime defleo textilis. Candidus blandior solvo carpo ter temperantia auditor vulgus. Aufero adicio synagoga auditor cum dolore cura quis vix celebrer. Architecto aliquid aspernatur asper. Praesentium tantum defaeco tutis cura utrum. Dolorem somniculosus audacia incidunt magnam adulatio creta termes. Universe suscipio suggero arx depereo spargo sodalitas suppellex coma tolero. Attonbitus sunt creptio summopere canis corrupti denego vigilo. Vulgivagus quidem in repellat communis demitto audacia crepusculum. Conventus sit confugo hic suus antiquus teres turbo deludo speciosus. Amplexus stillicidium libero. Brevis subvenio careo verbum utor demitto rem laudantium virga admitto. Cui carus libero ab vitiosus volubilis degusto amoveo.

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