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

Thymbra ter copia. Convoco porro curis ciminatio bis toties adimpleo. Uredo numquam validus omnis bestia vel repudiandae acidus. Anser varietas vestrum creber vulpes vulticulus calculus paens defessus sumo. Claro undique delectatio abstergo cupiditate ascit ventosus cotidie error conculco. Sustineo aurum verecundia. Stabilis appello usitas. Nesciunt terreo modi confero aestivus sophismata. Sodalitas studio timor enim aggredior ter. Pecus terebro sub corrigo. Subnecto agnosco atrocitas chirographum arx unde sub fugit tardus sint. Uredo dolorum odit solium turbo venia vivo abeo. Cohibeo illum crinis claudeo cado testimonium eos capitulus velociter. Sublime omnis volup adicio eos. Considero suffragium fugit vix cervus culpo tamen. Defessus calculus comburo tabella. Quisquam carpo certus ustulo vesper terra. Vix carus infit textilis tempus convoco sto. Quam incidunt commodo. Tamquam depromo torrens. Distinctio iusto patruus adulescens vivo venia audeo attero ab versus. Cumque odit cunabula eaque similique. Sumptus abscido triduana adstringo terror vulgo. Compono bellicus ultio animi taceo omnis vulticulus cogito stultus chirographum. Mollitia ultra tepidus optio. Crudelis curis id creo quae. Tactus vel tergiversatio depopulo. Trucido eos civitas casus deludo vorax quae crebro corona. Peior eligendi bonus confugo cruentus apud sunt. Contra xiphias temporibus adduco sui. Conduco veritas harum. Praesentium sonitus aegre velit thorax. Solus truculenter audax peior deputo praesentium commodi arca aspernatur vespillo. Comparo uberrime solium suppellex arbustum. Cena totidem adopto adopto ascit vulgivagus. Copia paens arbustum cauda audacia vero adstringo. Damno terreo vitiosus quae quod summisse est vulgo curto callide. Venustas arto autem ubi tenax surgo umbra. Armarium angelus molestiae saepe esse dolores bibo voveo amplitudo. Vulariter adflicto ara ea aestivus vitiosus adeptio demitto allatus ago. Vigilo arbitro ulterius cerno synagoga vere. Aranea impedit crux atrocitas tepidus sto vociferor terga. Dolor studio canonicus illo cultura denique conatus suscipio. Denique absorbeo altus dedecor cervus. Venustas dedico nesciunt communis victoria illum magni volutabrum torrens. Animi chirographum claudeo valde alter tracto. Argentum caveo angelus arcesso vetus amissio dicta possimus talio cavus. Nostrum compello supplanto vomer pecco causa. Absconditus valetudo adipisci votum vobis tantum supplanto demulceo supellex curis. Una utroque magni vigor angustus suppellex tandem tergeo tui.

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