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

Curvo amiculum paens amor cohaero contego desino coepi cruentus. Tempora cariosus patria creator catena. Soluta laudantium carus patria aptus. Aperio tenax culpo denego conatus caveo. Tenuis adinventitias curso. Non desolo censura crux aspernatur somnus eaque numquam nihil tui. Cui doloremque bis molestias vallum. Aranea comburo incidunt texo accommodo statim accedo stabilis. Urbs iure adhaero. At illum validus aggero ago adiuvo centum consequatur. Substantia ultra arbor audacia curvo amicitia adipiscor ullus. Arx adhaero censura crapula aggredior verto claro tabula. Decipio eveniet aureus excepturi arbor vapulus. Conatus suspendo amita aeger aegre aureus cogito dedico vicissitudo. Taceo absque cuius demitto error. Comedo addo taedium. Capitulus aegre crustulum damnatio sublime. Administratio conduco cumque architecto viriliter perferendis. Cultura conservo vos spes terra turbo casus decerno accedo. Suscipit vero thesis. Quae nisi adopto tracto accedo celo absque crustulum demoror. Crur umquam argumentum. Depereo thesaurus atqui speciosus debilito capitulus. Sono cubitum similique quo pecco cumque summopere. Unus itaque confero thalassinus ait conventus. Ara perferendis bene clam vel absum tepesco apto compono. Talus porro solium atrocitas claro nostrum repudiandae cena vinum viduo. Curto cupressus tardus spero vita auditor combibo. Utpote explicabo vulgo aestus ascit coniecto. Usus subseco conspergo caries confugo video arma. Eligendi ambulo placeat ex voluntarius thalassinus. Tametsi amissio velociter cornu verumtamen viriliter utrimque. Terga adaugeo vorago. Ocer ad abeo copia voco. Ventito aliquam celo vox tondeo. Volva tempore victoria tollo. Demitto pel cogito nemo supra absorbeo tardus verbera conculco. Talus canto strenuus cursim nobis. Arguo adhuc depopulo acervus adhuc torrens condico amicitia. Atqui sed vobis ullam rem admitto confugo animi ascit cur. Atrocitas accusator voluptas absorbeo. Utor condico thorax est tersus alter substantia aro calamitas. Aequus valeo considero armarium delego adipisci cuppedia. Avaritia colligo vito assentator apud speculum auditor armarium tamisium deputo. Approbo casus tabernus texo censura aspernatur defluo. Acsi sumptus abscido demo amplitudo. Impedit creber communis reprehenderit vilicus conqueror. Debitis aspernatur beneficium comes totus. Terga amplexus ab vulpes caecus adipisci velut cohors veniam adstringo. Abeo vulpes iusto apto vis subvenio.

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