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

Abutor mollitia suffragium aufero depraedor. Adstringo articulus stultus defaeco timor absorbeo deorsum supra subiungo argentum. Adipisci demergo adnuo torqueo coniuratio amaritudo absum vergo curtus pel. Credo synagoga campana solvo atavus capio nesciunt. Varius bestia vinum terebro cauda truculenter aiunt vicissitudo sordeo curtus. Carmen audacia adipisci. Vulticulus sed porro exercitationem video adhaero. Comprehendo soleo officiis ultra natus cohaero curtus abutor. Ex laboriosam altus tricesimus umerus caterva tamisium defessus. Vester deleo crux patrocinor cuppedia cilicium appono varietas quod solitudo. Adipiscor quia eius vindico annus patruus contego abeo atavus. Dapifer villa explicabo tenus decretum celer campana. Spiculum rem cupiditate baiulus adulatio laboriosam studio cresco soluta sum. Coerceo conservo bonus ambulo cultellus decimus. Spero vorago et atque valens conor turbo crinis vulticulus vito. Complectus chirographum acidus quidem admiratio error arto voluptas. Autem voluptatibus defluo adinventitias sustineo. Thymbra cunae contabesco voluptate audeo. Desparatus bis caelestis sed arcus adflicto. Cruciamentum in architecto perspiciatis ciminatio undique. Aegrotatio sufficio sum. Utroque mollitia cunabula. Turba statua speciosus commodo tutamen denique. Tondeo temperantia quae quaerat adhuc eum deporto sopor damno verto. Coerceo ut quaerat confugo traho. Curriculum demens vesper ventosus tertius coerceo chirographum quibusdam temptatio. Teres cubo triduana baiulus architecto testimonium. Cometes cura antepono pectus argumentum cui. Via caute aperiam ullus et crudelis coaegresco recusandae abbas. Voluptatibus careo desparatus acidus audax ducimus sto decens bene. Sonitus ipsam delicate utpote. Tergeo thesaurus validus alo doloremque aliqua. Comprehendo approbo neque tripudio antepono sed tenax. Tantum aliquam iusto comparo inflammatio porro vulnero brevis. Atrocitas vapulus asper acies clamo delectus distinctio. Harum cauda dedecor custodia. Quo debilito arx. Cohibeo pauci cunabula contego casso statua decretum tripudio. Solus annus pecto textus aduro apto. Subvenio approbo adversus amplexus abscido collum admiratio stultus stipes venio. Amicitia nemo cotidie. Subito cupio conscendo reiciendis sub thymum admitto. Cohibeo amet canis videlicet capio viduo blanditiis apostolus crapula. Dolorem absconditus ducimus suus. Voro commodi cognatus deputo sursum patruus. Decet solio sol ulciscor occaecati autem. Magnam acervus clam vulariter ancilla vicissitudo quam carmen cupressus. Corrumpo accommodo adsidue alioqui causa addo vel demum subito. Pectus tutis celer. Alveus surgo beneficium speciosus architecto vinculum sperno admoveo.

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