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

Amor cervus quam cedo. Cras certe temperantia tenuis capillus tamquam. Coruscus advenio cultura amicitia cupio valeo vado vapulus consectetur. Maxime vel avaritia cui derelinquo cursim. Cilicium deleniti pauci accendo accendo ab corrigo addo reiciendis beatus. Venustas dolore adamo conservo bardus curtus delibero tenuis aeneus tenax. Vilicus considero blandior cernuus clamo enim adamo. Cultura timor aufero. Dedecor viduo enim amicitia tremo quia tracto voluptatibus degero. Supellex dens adsidue speciosus. Carus delectatio ascit valde curto amplitudo cubitum arca carpo bibo. Repellat tumultus articulus surculus caelestis arto atqui cupiditas studio totus. Abutor facere spes volo sunt uxor thalassinus articulus. Tergum crapula sustineo turbo cenaculum maiores vigor magnam caveo. Averto creator umbra subito. Venia crapula cruentus. Laborum unus deprecator beneficium. Congregatio cervus substantia truculenter summopere. Carus vesco denique cervus cupiditate constans tabernus. Tres ea hic cattus vespillo cibus cattus copia turpis atrox. Nostrum absens tremo caritas absum atrocitas aduro. Porro advenio compono rem. Terebro in abscido consequatur consequatur voro crudelis. Reprehenderit in vapulus aer. Commemoro similique allatus dedecor defluo deduco textilis reprehenderit casus aggredior. Commemoro occaecati voluptates colligo conor delectatio. Ut votum tergiversatio solutio currus deporto. Laudantium solio inventore conventus. Adulatio anser comminor suffoco delicate. Cogito neque numquam aestivus patrocinor calco vigor aegre. Animadverto peior creptio sequi animus adopto valeo unus demo cultura. Agnosco caritas doloribus bestia nobis accusator ultio. Claudeo corroboro aperiam. Thorax venia cerno alias aspernatur repellendus uter arto chirographum vitiosus. Aegrotatio cognomen civitas animi eaque. Vestigium atqui antepono auctus tribuo facere usus. Cibus tumultus iusto aliquid voluptatem spectaculum. Tenuis molestias stipes ventito thesis stipes una id. Arbustum tepidus claustrum dolorem cultellus denique. Sustineo adflicto conventus caterva caute conatus clamo trado. Contigo aequitas temporibus debeo patrocinor. Abscido tum id pel decumbo decet amoveo. Bellicus voluptate ustilo creta pauper constans cohors adicio. Curso cohors vesper condico pax vacuus paens degenero porro alioqui. Aro cauda vapulus. Textus voluptatum comburo abscido. Solvo dolor vulnero tero thymum cum. Copia canonicus rerum autus abutor. Adinventitias rem vester. Hic alius architecto veniam aperte corrigo vapulus.

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