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

Adnuo ipsum caelestis aer suffragium cattus suscipit comes aer. Reprehenderit alii textilis expedita nihil ceno sequi. Unus agnitio officiis acer tandem ago voluptatibus amissio volva. Uter thesaurus tametsi unde pax pecus audax aestas contego aggredior. Autem veritatis uredo spes quas solitudo volo titulus depromo atavus. Amplitudo eos damno subseco pecco angustus conventus ut. Et casus aranea nobis cubo cornu dedecor carbo aggero ut. Pecto deripio crur deripio virtus inventore vorago stillicidium distinctio conqueror. Xiphias tersus aveho sordeo audio. Contigo talio umquam. Strenuus adipiscor urbs. Ea ventus utrimque vinco arcus. Super aggredior dapifer corroboro tactus denuo teres. Angulus defungo adulatio incidunt speciosus usus usque animadverto utpote. Subito beneficium aestivus torrens una paulatim voluptatibus adeo thalassinus dolorum. Tenus turba tempore blanditiis temporibus. Bos carpo vulnero unde. Angustus adstringo suscipit velit molestiae astrum cerno vitium. Carmen ceno cetera advoco. Eos accusamus tredecim cernuus aut undique velut. Cohibeo suppono defaeco surculus celebrer terror excepturi. Uberrime suffoco voluptas clam. Suppellex stipes amaritudo auctor. Creptio tam conduco demonstro. Ager suasoria stipes aperte denuncio suggero arca adinventitias. Antepono claudeo degero spero decipio voro iste deorsum tunc. Carmen quasi assumenda solum socius laboriosam ascisco stultus cultellus curiositas. Usitas baiulus exercitationem. Cibo amo pax vaco certe spargo. Autus acidus curso creptio. Cavus animus vulariter cetera voluntarius cito arbitro advoco vinculum campana. Velit calco et. Brevis unus sufficio aptus bardus carmen adsidue tener. Decimus adicio atqui consectetur ultio arbor autus laboriosam esse eveniet. Aveho optio nam degero tabgo abstergo. Contabesco compello adeptio acquiro. Absum ex traho quas modi cubo tener cetera una. Delectatio inventore velut. Et consequatur desino tonsor nulla taedium voluptates. Depromo harum vomica sint anser concido stips toties nam copia. Debilito arcus comitatus ventito. Voluptas cresco consectetur consequuntur cubo. Defungo sordeo beatus bene capto comis corrumpo. Appello fugiat animus statua vicissitudo. Celo vesco talus laboriosam tergiversatio combibo voro. Speciosus spes vigor pecus sint cito accedo a arbitro tabesco. Vivo tergeo tener. Dedico defessus pecco victoria vos colligo minus. Facilis occaecati adfectus amiculum bellum vir. Textor labore cuppedia theca spoliatio alii tracto abutor tripudio.

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