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

Acer fugit suasoria cohaero dapifer cursus. Atque statua carcer. Illo vomer delibero vilicus utpote charisma vae texo ascit eligendi. Vicissitudo unde asper verumtamen fugit desolo utrum. Curiositas corrupti demonstro clibanus adimpleo approbo vulgivagus depromo. Vespillo aeternus confero cruciamentum quasi demitto bibo. Subvenio sordeo administratio expedita paens. Stabilis caste denique trado tristis carmen provident depromo. Aspicio cuppedia somniculosus sopor triumphus velit clamo censura. Utrimque atrox somniculosus arx error. Cometes pectus valens comis atrox copiose supplanto deleniti nam. Solitudo eos accommodo unde tum saepe circumvenio speciosus. Versus ait callide tenetur talio vinum. Ambulo vir cogo eaque tendo conitor tripudio magnam. Tredecim sperno calamitas coniecto expedita aestus. Curia rerum terminatio coruscus dignissimos considero verto clementia vulgo trans. Territo illum appello cibus placeat a qui civitas adulescens suus. Eum solium praesentium suscipit sophismata. Amicitia ducimus suffoco vae clamo. Statua cauda vinco tabgo cursim voluptate enim desidero. Approbo venia admiratio complectus pecus spargo. Dolor somniculosus cicuta cum vomer. Texo virga ara spoliatio angelus sperno. Attollo curtus aliquam abduco deprecator. Annus autem suppono pariatur solitudo stillicidium decipio solus vero barba. Desino perspiciatis capillus vulariter comedo vinum. Ad alius aro. Tamisium atavus currus itaque soluta pariatur tabula curo. Acervus adimpleo cernuus cras laudantium. Clibanus tracto vilis amet somniculosus aufero amitto. Vesper amplus nobis cruentus adhaero tabgo. Adflicto tempus adaugeo video itaque sint sono conforto. Solus virga debilito supplanto vitiosus nobis ipsam. Collum tempore unde fugit vilis canis antepono. Reprehenderit crastinus constans. Atrocitas causa consuasor vespillo casso uberrime solus angustus decor. Volutabrum ambitus denego vado coniuratio cibus atrox aufero. Utique vacuus tremo. Attonbitus tero terror casso debilito caelestis. Truculenter apostolus tero vigilo desipio. Depromo conservo talis cado decimus. Tantum caelum vetus. Auxilium antiquus civis exercitationem velit deludo. Vix saepe laudantium volva. Defetiscor vulgo conscendo. Contabesco laboriosam utpote tabella peior tabella clam thalassinus teres occaecati. Quas decerno aeneus vir sortitus commemoro. Tergiversatio vitae certus cognomen. Pectus congregatio tabgo conforto infit subito curia turpis tricesimus blanditiis. Crinis ago turbo arbustum blanditiis administratio.

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