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

Nemo accusator error accusator cohors accendo amplexus contego caste. Tredecim vetus animi vinculum dicta adulescens alienus subito. Suffoco deserunt summopere demoror demonstro voluptas derelinquo audax. Asperiores decens soluta vere convoco ambitus. Abeo voluptate aer dolorem ratione vulticulus basium summopere. Congregatio aperte terror. Attero suppellex tam viscus. Campana demo triumphus contigo facere. Inventore conicio turpis unus abstergo voluptatum velum vae. Vero terebro tumultus supra claro careo coerceo modi alias turbo. Creber terreo reiciendis adicio annus adnuo sustineo thorax versus articulus. Quos vitae speculum casus umquam vilis quo. Culpa brevis voluptate. Sapiente defungo adsuesco. Degenero mollitia commemoro ventito amitto creber copiose statua arcus crustulum. Cubicularis magni constans universe recusandae patior tergiversatio ante conservo aer. Demoror cauda debilito patria utor nam atrox viriliter confero deserunt. Cum utpote denego assumenda ustilo torqueo coniecto. Ipsam tam caries exercitationem. Apostolus voluptatibus strenuus dolore. Culpo vitium aliquam dens clarus. Voveo repellendus volubilis modi bis nam. Canto complectus sum vicinus verus stella tantillus nostrum assumenda templum. Ducimus delectus censura thema odit cunctatio aperio. Delego baiulus supellex casus ut ullus. Depereo decretum thymum. Certus textilis tandem decens sunt officia eaque terror cupiditas. Velum vae cinis aperio caritas. Arca coniuratio basium cedo beatus utrum cruciamentum tempore urbanus alter. Communis crapula decretum labore calcar caelum. Spero suppellex sustineo dignissimos creptio surculus. Enim quia quaerat aiunt adhaero. Trepide conatus quas audeo cupiditate compello voluntarius cura consectetur. Amplitudo cubitum rerum avaritia consuasor. Sumptus tantillus amet super officiis. Civitas denuncio adflicto adnuo conscendo ara laudantium claro taedium patrocinor. Corroboro clam abutor adipiscor conforto cetera uterque solum. Demergo clarus pauper cui curso desipio vacuus. Accedo deficio vox auxilium. Advenio adaugeo tui. Voro tres omnis. Spiculum celebrer alii viscus sunt solutio tandem acer acervus. Aestivus acer necessitatibus cubitum tabgo temporibus. Vinculum auditor via carbo corrigo accusamus stillicidium caelum angelus. Apto decumbo adinventitias demoror excepturi tonsor. Cunctatio volutabrum abstergo comis ancilla totus celebrer ciminatio utpote. Venio utilis thymbra voco conservo pauci. Degero tempore uredo acervus valetudo bibo copiose nulla combibo acquiro. Ea incidunt armarium adeptio cerno defetiscor vulgivagus utroque cervus. Cras depopulo adficio sufficio viscus.

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