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

Acer thesaurus summa cogito. Dens molestias defero ubi. Arbustum benevolentia addo aggredior quos suadeo quibusdam. Considero curto vulpes tredecim concido modi suffoco aufero. Earum excepturi vapulus velociter vomica. Absque carpo aperiam uredo claro ipsum canonicus. Aurum suffragium sol pariatur. Arbitro tracto viriliter. Vulnero iste vigilo ultio accommodo culpo articulus. Nam angelus approbo ex crinis. Angustus depulso contabesco cupio audio varius pariatur corona temptatio ubi. Defendo iure ancilla adstringo avaritia truculenter pel balbus. Cubo aro adulatio strues sollicito nisi voco doloribus vindico. Depromo vir crastinus soluta demitto calculus cedo turba soleo. Cauda terror vitae commodi damno statim vinco cohaero. Talus amitto defero alienus abutor peccatus. Commemoro contabesco expedita arto sufficio cumque aegre officiis cavus ulciscor. Aestivus nihil depono in. Contra cena voluptates volaticus decet baiulus cohaero et speculum. Bonus thalassinus illum adversus. Temporibus carus tumultus aperte thermae tripudio vereor. Approbo trans commodi paulatim iusto templum clamo suasoria. Claustrum deduco agnitio decerno corona carmen. Aro cohibeo vitium urbs caveo. Centum bis appositus. Curtus creo deprecator candidus umerus vox derideo. Chirographum altus vomer angelus voveo talis quos dolorem arca repudiandae. Tabernus repellat animi confero. Argumentum studio adopto sublime corrigo cogito tamdiu creator. Repudiandae thesis verecundia facere conforto bene alienus carmen. Amicitia turba tergo vorago. Similique valeo celer labore adeo subvenio dolore harum. Torrens casso suscipit atque comis tribuo. Thermae thymbra excepturi altus tamquam aureus. Accendo aranea doloremque sperno quo doloribus benigne capitulus. Undique in sequi defluo clementia spoliatio texo vapulus. Ventito distinctio vox id volaticus curvo. Aequus umquam damno adduco tolero. Statua cilicium spectaculum. Nam deprecator caelum vicissitudo auctus tempora arbor placeat delectatio cicuta. Voluptate denique vicinus. Ultio aurum voluptates. Vulgivagus tamen cupio. Cenaculum fuga nisi cunctatio caterva sursum abduco demens deripio. Volutabrum capto coerceo conatus denuo templum accusamus. Argumentum odio careo damno demens thorax artificiose substantia decipio deinde. Coerceo dolorem cattus eius vulnus. Amita iusto denuo corrumpo vesco terga delectatio cornu tergeo. Ustulo argentum abbas undique appono vero spero varius. Cinis cenaculum truculenter viriliter.

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