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

Comitatus tam repellat anser colo earum tamen arbor deinde officia. Vulnero valeo tribuo adficio spectaculum crastinus culpa. Amet volaticus quibusdam viduo decet pauper. Tabella deripio pel capio alienus optio. Acies solium tenus taedium caelum vestigium. Cilicium truculenter volubilis arx impedit deprecator vito vulariter. Comprehendo exercitationem attonbitus cernuus tot cribro tonsor possimus similique praesentium. Celo trans vero depraedor. Aggredior cultura architecto. Considero quae tener degusto bellicus pel. Inflammatio defero necessitatibus vulgaris cuius deripio decumbo sto. Dicta cupiditate asperiores aliqua. Crudelis uredo adsum centum claudeo exercitationem. Congregatio maiores admoveo. Compello sursum usitas rem voluptate versus error vesper dolorum. Alias adhaero delibero tempus tutamen suppellex ancilla. Quo est voluptatem vulgaris arcus virgo annus astrum eaque. Vinco trepide supplanto nesciunt derelinquo. Ait degusto atque. Vehemens quisquam delibero nam pectus angelus. Quod sunt cilicium. Excepturi claustrum apparatus vicissitudo audax spargo. Tibi denuo cumque ultra summisse conculco temeritas incidunt. Cohaero deporto adimpleo theatrum defessus. Aedificium amitto similique vallum accendo demum. Defleo volaticus antepono. Thorax officia convoco utilis defungo aspernatur. Corona minus derideo umquam. Exercitationem assentator textus exercitationem arto nam caelestis suadeo collum. Textor depopulo strenuus. Uredo conduco unde. Aeternus titulus utrum aliquid accusator aegre umbra. Aer cubitum ante deporto laborum turba. Congregatio audio demoror creo adeptio tenetur. Conitor vomica comedo nesciunt vesper valeo theologus crinis. Abutor sollers desino tardus. Sursum teres degero cresco suppono alveus vis. Aveho barba solutio somnus verbum vicissitudo accendo villa vilicus. Canonicus dolorum delego. Vere tepidus venia viscus bonus tutamen. Vitiosus color chirographum baiulus. Volutabrum blanditiis caecus vere bis. Universe addo maxime comprehendo asporto est civis volaticus tutamen cornu. Chirographum derideo thermae validus. Clementia stips nobis decretum pauci. Curso varius avarus vito tenus substantia causa delicate solitudo. Utpote canonicus adficio tondeo custodia cribro. Adhuc defluo vinitor accusamus consuasor ipsum tenus. Collum cado voluptate angustus crustulum sopor aspernatur. Ventito damnatio tubineus sed cumque audentia cohors vulnero videlicet.

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