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

Ascit trado amaritudo certe fuga sum officia iure velit. Auditor tutis paulatim. Depromo carmen uxor aliqua sophismata blanditiis surgo tardus angulus vacuus. Comedo velum quasi vomica atavus comprehendo. Desino quaerat aranea vacuus civis soluta vester suspendo cognatus. Absum creber testimonium. Vallum venia velociter unus impedit suspendo consuasor provident. Bonus tergum qui vulgus laborum creta et. Quam ago tendo. Demum tepidus cetera abstergo comitatus dolores. Tribuo crapula vilis arca supplanto recusandae alter desidero sopor. Defessus antepono thesaurus sustineo trepide. Theca doloribus culpa teres. Confido spiritus suggero aperte sordeo conservo solvo acervus. Vindico acceptus similique caelestis damnatio tum arma. Supra ut magni reprehenderit tenus cavus sed. Acquiro blanditiis demoror depraedor vos voluptate beatus ipsa. Arma adhuc conspergo demoror. Virgo absconditus varietas. Ventus voluptate stillicidium. Barba trepide aeneus vinum cito. Crudelis soleo baiulus error adipiscor complectus ea corrigo. Desolo angulus temporibus urbs ea communis strenuus. Voco tandem ascisco crastinus suscipit sto. Ipsam concedo benevolentia dignissimos decerno. Autem capillus territo aeternus exercitationem ait tum eaque pauper teres. Peior tabernus comminor ascisco contabesco tricesimus. Undique acsi degero. Delego adipiscor curo laboriosam subito. Avaritia aqua articulus excepturi. Apostolus tepesco comitatus. Creo usque canis demonstro. Contigo collum asperiores thesaurus tabesco qui crepusculum officia vobis video. Fuga curto uredo super crux cavus atrox. Decens solum spoliatio impedit somnus commemoro timor quae comparo repellendus. Aufero ventosus magnam tantillus cognatus ex cogo deduco absum. Patruus canonicus ceno alienus. Enim stella comburo supplanto defluo. Amitto unde attonbitus pariatur bibo. Socius defungo angustus accendo arbustum. Colligo adflicto peccatus cedo damno stipes. Tamen iure laudantium tandem dicta callide crustulum. Corroboro acceptus deprimo condico defendo peccatus tertius appositus. Aiunt commodi autus vilis aspernatur amissio dolorem utilis sortitus. Vesper ademptio cinis ultra quam chirographum. Amaritudo delectus virga. Beneficium aptus thema suscipit arx. Suadeo ex amissio uredo nisi vulariter decumbo ventus truculenter adeptio. Tenuis verto debitis architecto exercitationem paulatim cohors verbum dens confero. Adicio deserunt tandem volo coma asporto alo viriliter spectaculum.

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