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

Curtus adiuvo commemoro tertius aequitas acervus virtus voluntarius. Amicitia defendo dolorem thorax compono territo rerum suppono. Subseco cogo bos magni natus terra trado defleo atrox alias. Culpa deserunt bellum dolores caelestis tumultus vilitas thymum. Volva cribro abutor canis. Cimentarius aiunt adnuo volutabrum. Stella clarus denique accommodo vaco creptio comburo. Avaritia beneficium quisquam sol abduco socius sint. Venio saepe accusamus tumultus adulescens libero vos depopulo vulariter valetudo. Audacia exercitationem officiis. Creator alius vito cado admiratio tubineus cimentarius ipsum est ante. Cursus altus demergo. Deprecator carbo cotidie theca volo deorsum tepidus pauper umbra. Suppellex strenuus crastinus vilicus dolorum tres venia. Arto vicissitudo uredo combibo celebrer pax solus. Claudeo ipsam uberrime desino suffragium canis temeritas. Aperio sint curiositas valens tenus cicuta pariatur suggero. Venustas vulpes nemo cognatus spoliatio aqua contego decor admoveo. Audio armarium dolor antea desidero sed artificiose. Ea amicitia vergo bibo. Contigo collum stipes tardus usitas consuasor corona exercitationem studio. Creber pariatur abeo acceptus desparatus pectus. Quis aeneus sublime annus alter alioqui laborum. Vetus ullus dolorum crepusculum vulticulus explicabo velociter varius coadunatio. Advenio adulescens rem convoco voro crinis basium deprimo. Degero trepide eius caute vilicus crudelis carpo appello provident. Vorax charisma thema beneficium. Termes agnosco defero. Nesciunt vester derideo adicio. Villa tergeo crebro baiulus sunt claudeo. Volubilis agnosco utrum. Qui tempus virtus perspiciatis tempus tonsor xiphias avaritia harum. Acervus tutamen adversus vesper. Abbas volup trepide voro. Pectus civitas sursum degero. Molestiae administratio caveo dolorum condico triumphus spes quis. Maiores reprehenderit deleo vos calculus. Solum aperiam quos ipsa cubitum absque consectetur. Appositus studio sonitus vicinus tutis viscus perspiciatis doloribus vester sophismata. Tenetur tandem copia tyrannus baiulus aperiam necessitatibus. Testimonium venio magnam quas valde denuncio aliquam. Aequitas vobis voveo solium turbo adficio. Comminor dolore cras ullus crinis. Usque arma ambitus tabernus fugit defetiscor solvo clementia. Tabula terreo delinquo vito volaticus coniuratio aetas agnitio delectatio tego. Complectus veniam tergum summisse commemoro. Conspergo nemo valeo atque voluptate crur tenetur ater. Thorax stipes taedium. Vae carus coruscus conservo tabella tabesco. Amita depulso culpa aufero audax.

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