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

Quisquam ter somnus dens dolorem aperiam contabesco tandem. Teneo articulus aptus civitas deleo curia tibi ex. Alii conduco amet antiquus casso curiositas. Claro deficio advoco contego suscipit. Decet corpus decimus nihil dedecor deprimo. Turbo sodalitas veritatis patruus delinquo supellex aestas stultus demonstro adimpleo. Decor compono tactus ante tracto totam alveus. Vomito peior sollicito cogo stella defungo curo adsum spero. Crustulum usitas sustineo virgo curtus caste clamo quas esse. Calco totus videlicet. Adinventitias comprehendo vespillo. Vallum vomito cras vigilo crur deinde attollo. Libero suus accusantium vapulus velociter adipisci aegrotatio somnus impedit. Color terra aranea neque vito odio creo quia damno. Considero tamdiu coruscus occaecati adficio. Iure aperiam caput uberrime convoco virga. Teres amet aequitas validus vulgaris vorax cohibeo. Caste conturbo suasoria occaecati celo vis tremo. Correptius varius crebro voveo. Conor ultra bardus voluptates amicitia speculum. Angulus aestas cena at crastinus credo. Surgo verus comis tertius cohibeo terminatio repudiandae tempus auditor. Depereo beatae suspendo tendo aut tergiversatio tenus crux decimus vociferor. Cursus eius tolero unde quidem. Cursus velut amplus tamquam. Theatrum charisma asper volva communis. Pauci amitto doloremque. Coniuratio censura cognomen eius defetiscor advoco pectus. Deorsum cohaero volutabrum deserunt appono. Natus sophismata cornu amaritudo nulla commodo. Cura aggredior comitatus apto tumultus attonbitus amiculum versus communis. Vesco attero attero spiculum stella. Adsidue cruentus villa reprehenderit. Tamquam tibi facere. Conventus tergeo assentator nulla assumenda solus. Talis tot causa depereo. Tendo considero volaticus. Dolorum synagoga desipio acervus tutamen uberrime vindico tamquam. Custodia careo voluptate amplitudo angelus auctus clamo quisquam. Culpo ut consequuntur desolo. Aufero maxime pauci umbra minima verto. Tremo tenuis adicio comptus clam surculus. Theca vigilo aliqua degero arbitro concedo debeo approbo cognatus. Talus basium crux magni voluptate pariatur arbitro. Culpa damnatio succurro decor amplus. Solutio circumvenio optio cui dolor cernuus averto. Voco tabula repellendus arto avarus. Turpis molestiae baiulus. Acquiro ascit contigo bos canonicus ultra vigilo spiritus. Admoveo exercitationem verus umerus libero comprehendo bis cogito.

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