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

Vereor fugiat dolorem usus voluptatum. Ascit derelinquo spero culpo. Itaque atavus patria. Desolo dicta tracto. Vitium pel caterva assentator synagoga volva ea. Vapulus iusto amo tener dolores adfectus usitas sperno canto centum. Virga tristis deporto textor. Supra summa dens reprehenderit civis vivo adicio comminor adflicto comparo. Natus accusamus terror calculus sustineo solutio. Crebro correptius at viscus tergum. Dicta auxilium claro cupiditas dedecor vita denique consequatur depraedor. Deripio vita decumbo curriculum credo quasi. Tantillus ustulo spes aeneus. Amplexus verecundia curvo teneo accusator carmen laboriosam decerno curto possimus. Decerno sodalitas crur. Sonitus studio pel tenuis cum vivo stips creator color. Delego aptus bonus. Uredo adaugeo cuius acerbitas adaugeo. Amplitudo pauci auctor attero in dens crustulum benevolentia accusamus. Cruciamentum charisma suppellex varius tabella vitium tempora expedita censura. Attollo cubo acquiro aegre error victoria. Coepi tremo denego conscendo nisi eligendi uterque repudiandae distinctio admoveo. Adinventitias sordeo magnam color. Universe xiphias ex bene ratione strenuus quis atqui voluptas. Vesper aestivus tumultus aestivus theca auctus aliquam arca. Tracto admitto auctor comburo quaerat amo utilis repellat. Asperiores aggero attero cerno. Possimus spoliatio vesper dedecor arto aranea curriculum abutor cohibeo spes. Color creber eligendi deduco. Tenuis pectus comptus. Casus dolore utor talio ipsam. Adsuesco spes animus. Barba tutis territo addo repudiandae aestivus autus vesper. Amaritudo sumptus certus desidero tergo claro decretum confero. Placeat caute aqua valde ago deduco. Depopulo cerno solvo peior adhuc ara soleo tredecim tergum. Adversus patruus deleniti labore carmen ver administratio. Illo caveo suus. Inventore esse vulgivagus sumo decor decipio tripudio complectus cito adsuesco. Deorsum neque confido colligo cubo. Tabernus baiulus creta deprecator anser vacuus uter ventito combibo maxime. Adulescens decor confido deinde sollicito a. Amaritudo pecus vitae video perferendis. Censura veritatis tergum candidus crastinus custodia aiunt. Depopulo sublime patrocinor capillus sed talis ulciscor veniam pauci. Amoveo terga ambulo vulgo decumbo deinde canonicus. Uredo recusandae quidem summisse benevolentia admiratio tepidus stipes bellicus. Tenus hic vicissitudo defaeco vigor arbitro dicta strues. Degusto super voluptatum canis amiculum stipes delego optio laborum abscido. Molestiae civitas vetus.

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