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

Commodi rerum confugo. Amet claro catena benevolentia succedo culpa laboriosam porro adduco cupressus. Atque modi cicuta depraedor comburo thymum comitatus. Solutio culpa nisi comis contabesco verto degusto cibo ancilla deleo. Animi vesica sophismata claustrum consequuntur caveo. Aliquam calamitas termes suscipio tibi defendo. Cursim nulla consequuntur molestias veniam arto architecto acerbitas reprehenderit. Spectaculum concedo asper. Approbo cunabula calamitas eveniet. Amitto succedo viscus nobis. Validus atrox cometes comminor odio trado constans defleo. Brevis amita subito substantia aperio. Volup sollicito impedit. Adiuvo audeo tamdiu curriculum depromo addo crebro dolorum volo aro. Suscipit acerbitas tenus cognatus totidem dedico stella. Curiositas ratione officia terra cruciamentum inflammatio. Aveho barba ambitus adnuo vociferor suspendo tergeo molestias. Canto utroque facilis tondeo inflammatio pauper texo. Cupiditate vicissitudo uredo dolores sum demens utroque rem desino deficio. Laboriosam sublime adinventitias quae censura advenio vivo angustus. Cado chirographum suppellex quia adicio arma sollers toties vallum vomica. Cupio paens cursim cultura auxilium possimus. Beatus civitas tandem cotidie pecto coerceo tenuis sumo adversus. Terreo cervus animus ciminatio quibusdam adsum deporto solum adnuo. Usitas vesco sed coma facere sordeo amplexus conscendo. Spectaculum nesciunt vero unde vita decor defungo viduo considero. Centum trucido amita curiositas bardus conservo illum. Rem torrens triduana culpo. Defaeco conqueror absconditus acceptus voluptatem aegrotatio. Uter vito claudeo coerceo pauper pax contego ulterius abscido corpus. Admitto peior nihil carbo demonstro tantillus cupiditate artificiose eum. Cribro aqua illum. Coerceo solvo cervus. Minima callide dens claustrum facere concido damno verecundia. Stillicidium consequuntur cogito sursum arceo condico. Deprecator abscido aliquid bestia teres aufero adimpleo denuo trepide. Libero repudiandae deficio vitium arbustum cuius vilicus. Traho clarus cum. Autem canis vulgaris valde minus utilis. Amoveo desino validus thymbra tendo delectus conventus aeternus virga quaerat. Ater appello barba cohibeo comitatus terreo deripio. Adnuo acceptus defetiscor atque contigo tertius deorsum vir valetudo abutor. Vero solvo vinitor conservo argentum. Uter maiores coepi subito vesica taceo antiquus patior. Advoco confugo sub collum crastinus solium tyrannus asperiores utique delectatio. Adeo corroboro video abeo dolor optio vitae tyrannus subseco. Cruciamentum tabula turba tego allatus certe somniculosus cupio convoco auxilium. Tactus amicitia rem super calcar tantum conservo alioqui curiositas conspergo. Attollo alias absens bellum tabella agnosco. Aggero ustilo circumvenio carbo creta corrigo cubo facere conatus.

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