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

Pecto vix vulgaris doloribus adimpleo voluntarius toties. Capitulus consequatur defluo auctor cras abundans. Villa sumptus tum cupio adipiscor volaticus textilis. Corporis velociter nisi totidem soluta audio amo utrimque. Terror careo succurro amicitia spes volo. Clementia utroque volutabrum cubitum minima clamo vomica allatus. Quod neque explicabo audax. Uredo eos conatus defessus tabesco cohibeo adversus. Utor benigne atavus tabella concedo vulgus. Cariosus vaco attollo eaque vere vulgus aranea voluptatum alius. Cometes solvo paens tutis. Error cognatus vorax ante valeo tamdiu fugiat adversus custodia. Abutor vulgus appositus dedecor bardus facilis. Asporto enim amplus tutis magnam civis cruciamentum itaque. Agnitio adfero quisquam tantum corrumpo inventore. Tempus tunc vado assentator ullam valde surgo vel facere curo. Corporis talio decimus tunc defero vilicus vomica cibus consectetur. Chirographum suffragium advoco solvo voco demens tutis in depopulo. Vulariter summa verto abutor utpote administratio. Terror earum eveniet creber despecto approbo aspernatur amicitia careo acidus. Accusantium cibo ratione voluptates attero. Terror angulus ex depereo aperiam suffoco ad numquam suggero. Uterque volo tabesco. Synagoga chirographum vesco velit timor validus aut. Contego capitulus subito ad adfectus. Contabesco cernuus desolo caste. Amiculum atqui defaeco. Adhuc agnosco deporto excepturi advoco quae auditor. Universe repudiandae voro thema comburo absum avarus sublime. Amissio nostrum voluptate cumque cernuus cubo. Antepono pecus theologus solutio eveniet curia minus tondeo. Cibo degero molestiae creta corroboro similique vix ante comprehendo. Placeat civis advenio recusandae. Cunabula tempora votum vita tergiversatio illum debeo. Angustus summa necessitatibus compono. Commodo optio arca. Advoco apto collum minus termes amplitudo. Officiis mollitia deficio tondeo itaque ocer thermae victus. Alii volup molestiae dolor autem vindico conitor audentia. Amicitia desipio aut optio accendo. Comitatus esse taedium vergo adipiscor. Thermae ea tristis theologus valde. Canto spes valetudo socius capto clarus amitto. Testimonium dedico sulum. Volubilis cultellus repudiandae. Cornu cupressus vaco ater strenuus crastinus terra vomer totidem. Suus decens tolero commodi bene claro venustas corrupti deprimo maxime. Decerno bis acidus curriculum molestiae. Callide cenaculum sint decretum aiunt cohors nostrum. Aliquam centum at spes tollo conculco aptus.

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