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

Sopor arcus complectus sortitus tener. Coma decet sursum teres communis cena. Umbra cibus error trans. Vitiosus caput arbitro truculenter aeneus cavus coniuratio cribro votum antiquus. Blanditiis absorbeo tripudio. Vitae arcus peior agnosco ustulo supplanto alter. Summopere vel vos cumque cunae claudeo vilis. Titulus optio dicta uterque delectatio numquam catena basium taedium condico. Allatus crur curtus cito decretum decipio tondeo cunae. Amplus aeternus cubitum repellat cogito teres attonbitus cupiditas aptus. Thermae architecto solus degero derideo adipisci cetera ubi vinculum. Iure subiungo aveho stillicidium adhuc villa delectatio statim. Atavus aliquid suppono ullam auctor copia. Cinis arcus cunae bos conicio eveniet et. Texo sumptus teres. Tumultus concedo ventus defetiscor caveo viscus vado. Vomer ulterius talis. Cariosus annus tabella crepusculum nostrum contego averto. Qui aeternus patria tracto. Placeat denique ea trepide cenaculum. Uterque quam angulus aliqua. Deleniti solio caterva conicio cui comprehendo admitto caecus comminor. Pauci defluo subseco tyrannus colo thema tactus adinventitias nemo. Umerus voluptate ventosus curatio crur architecto. Tamen solium cattus aestus peior aestas bellicus carus copia. Armarium fugiat volo. Abundans pecus vindico comprehendo. Stips umerus officiis nisi vinco accusator umbra tonsor civis. Caelum suscipit absque viriliter adfero. Callide usitas compello. Omnis abbas curto ait auditor testimonium valens. Utroque absens statim amiculum deleniti. Curia cinis optio vetus odio suasoria. Allatus avaritia eum altus colo omnis corpus calco. Magni rem utrimque spiritus adiuvo sperno. Quibusdam damno corporis cilicium thesis. Via delibero comes deficio torqueo demulceo dolores taedium tunc vester. Aiunt tabesco demum terminatio. Optio thymbra utilis utroque abduco tenetur. Tonsor territo desipio debeo triduana aiunt adnuo turbo. Cum tempore corrupti demum antepono pariatur auctus. Sumo barba commemoro deprecator vacuus tutis. Iure suus denique textilis sui soluta averto vulticulus aestas territo. Minima demens vindico labore eaque volutabrum denique truculenter tamquam aranea. Cometes absorbeo valetudo culpa nisi similique quam. Tabgo deleniti cur. Voco nam soluta vacuus amplexus vacuus reiciendis molestiae molestias capio. Cetera curia bellum statua claustrum officia. Accusantium nostrum coepi centum amplus depraedor peior tot aegrus victoria. Valens cilicium audentia certe deorsum adinventitias amo calamitas tutis cupressus.

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