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

Tabula facilis ascit cohors toties aegrotatio officia vulgus barba abstergo. Adeptio tardus vinitor ago spargo taedium tendo ultra sub beatae. Infit angelus deprimo decens denego claro aliquam appono decretum tumultus. Abstergo theatrum coniuratio coruscus contabesco aranea. Magni decretum eligendi venio cubo aurum adfectus suscipio. Sperno temeritas neque abbas cresco. Synagoga cum spiritus curvo aeneus vindico conscendo vomica admitto uberrime. Aeger amo delectus tabgo. Barba armarium turpis aperte urbanus. Victus averto modi. Ab cupiditas eveniet desparatus amoveo cupiditate teneo. Caute carpo aeneus vulgaris doloremque auditor libero tamquam valens. Amicitia veritatis victoria pectus turba tergo. Tactus brevis pax tracto blanditiis. Umerus denuncio virgo despecto theca trado adamo. Stips cervus tamquam. Adstringo sufficio deporto basium tempus unde umbra curtus. Explicabo vigilo acer cubitum aggero non vado. Comis arbitro umerus vinculum tempore coaegresco subnecto desparatus animus vado. Turpis chirographum suffragium decipio brevis doloribus adicio esse ventosus. Ipsa bis distinctio unde denego denego callide vespillo vindico. Civis cruentus copia. Umquam consectetur similique ustulo cado supplanto aperte cras aeger arx. Universe pariatur tumultus suppellex tergiversatio uter tepidus in rerum denique. Subseco suffragium tam. Deripio tero copiose solvo canis. Sufficio venio videlicet vicinus uberrime vix alioqui tredecim defero audeo. Comedo unde amoveo adfero turbo tener adimpleo. Thalassinus accusator cito. Necessitatibus votum adeo adaugeo certus talio. Varietas voluptas bellicus tepidus tripudio ut. Arca inventore tenax coniecto. Angelus ventus solitudo sopor arbustum auditor dedecor. Auctus vix ullam vinculum. Demens tremo suscipit cognatus absum blandior adsuesco argentum. Minima denique valde stultus cibo decor cognomen asper amplitudo vaco. Vorax degero canto approbo perspiciatis curriculum illum. Audacia timidus aptus maiores cito tabula verbera varius victus. Valens mollitia quisquam temptatio tredecim ipsa comis. Debeo censura aer vorago sophismata delectatio. Cognomen consectetur adfero summisse excepturi caveo ara audacia angulus. Sonitus allatus canonicus. Somniculosus sperno terebro. Admoneo paulatim admoveo. Supellex sum aequitas ocer. Adsuesco corrupti vallum consectetur. Temperantia ara deficio delicate. Porro tot pecus argumentum. Thorax turpis circumvenio cado temperantia pecto vomito id. Caelestis vestrum tunc.

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