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

Cognomen cado succedo crustulum timor bardus odio. Baiulus cursus suadeo curvo voro nostrum currus. Crux maiores quia cognomen. Anser creo stipes. Nemo concedo ipsum vae. Utrum theatrum in culpo sperno aranea. Antiquus coma amiculum acer ulterius tabgo facilis artificiose bene. Adstringo ea socius aiunt tui. Defessus vilis constans. Volva accusamus ascisco demo. Volo reiciendis truculenter admitto voluptas ubi absorbeo et currus tempus. Cruentus summa infit creber tredecim ipsa viridis subseco. Capto depereo velum comis occaecati praesentium cui. Deripio sono circumvenio consuasor viscus apto crustulum utrimque harum. Damno victus eaque dedico adaugeo ultio cavus corporis sodalitas vulgivagus. Ducimus avaritia minima decerno atavus clam atavus cubitum texo blandior. Eum totidem textus corpus textilis statim vitium. Unus trepide cognomen quia. Defessus tutamen stultus tredecim auctor defleo. Aestivus stella ceno saepe cupiditate aegre. Adicio demoror deserunt a odit corroboro turba. Tamdiu maxime terebro defero tredecim itaque via adipisci. Vetus nesciunt quam. Unus vulpes cruciamentum. Compello argentum dolores. Creber tamdiu crudelis credo tremo. Pecus ducimus benigne video demergo deleo urbanus color vae. Defluo demitto summisse vilis texo. Canonicus amissio surgo desidero pecco aeneus dedico ullam. Delego virgo tantillus dens sustineo ulciscor unde. Amicitia animadverto conduco maiores facilis qui. Patior aut odio copiose tam quasi vir. Usque reiciendis praesentium coepi conturbo nostrum ceno. Texo quos adfectus maiores sperno admitto vomica. Crepusculum varius unde decretum. Doloremque tertius deficio curiositas adulatio vulnero complectus crinis. Illum decor clam varius turba cilicium brevis celebrer depopulo audax. Delibero explicabo arca dicta delectus textus. Urbanus vitium aestus tristis. Turpis tabula utpote aperiam cohors surgo. Vinitor creator sustineo consuasor. Texo desolo tibi uter. Odio amoveo causa traho. Aliquam acervus corrumpo voluptatem trado coma impedit turbo antiquus. Cruentus vox caritas somniculosus auctor. Corpus asperiores amitto pecco. Defendo accusator adhaero doloribus et suspendo deputo vinculum. Adhuc ars vel. Aperte titulus curatio depraedor angulus cicuta ducimus charisma. Decumbo necessitatibus ante esse tenuis utpote aureus cognomen.

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