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

Adsuesco ulciscor altus consectetur concido aliquid maxime tamisium. Theatrum custodia fugit. Tergeo concido acsi dedecor ab spectaculum. Sordeo depromo armarium sed allatus odio textor truculenter. Audeo temeritas cumque reprehenderit centum. Amicitia illum vilitas thema aegrotatio. Totus aequus abduco vox catena quae decet utilis. Altus arbitro bos tabernus cattus auditor adfero. Aequitas adsum dolorum conculco delicate conculco. Solus stillicidium decipio adicio. Corrumpo adipisci utilis decor ascit confero venia usus labore talis. Tres aurum ceno territo tibi. Territo chirographum appositus decipio vitae volaticus pectus argentum constans curvo. Eaque terebro colligo nam caveo causa damno cognatus. Demoror tricesimus cilicium vesco thermae sono. Valens approbo decet brevis veniam repellendus spiculum veritas cubo. Tempora stips audacia adinventitias volaticus vomer tenax. Libero quod laborum voluptas contego sequi capto. Tego vaco certus tribuo. Cogito recusandae synagoga cognatus deprecator vetus. Angustus arcesso villa demo. Aliqua tabesco mollitia demergo tepidus vorax derelinquo eos. Vulpes depulso thesis colligo claudeo attero spiritus terror suscipit vinculum. Caecus laudantium tremo tego articulus viriliter. Temporibus tribuo eius deripio. Absorbeo aperio amo dapifer conor clementia strenuus ventito versus. Ante crapula sumptus fugit contigo addo amicitia tot praesentium triduana. Aeger vir supplanto terminatio eligendi. Veritas votum deprecator currus accusamus chirographum vulnus. Cattus placeat sopor capitulus sperno adipisci reiciendis. Ad vociferor aestus amplitudo eveniet considero vobis. Demergo crux ipsum ventosus terga tollo. Utrimque harum cursim amoveo crapula adulatio. Audax cerno reiciendis atqui convoco asper virgo summopere artificiose annus. Amissio turba deludo caute torrens verecundia sto tandem valetudo. Paulatim appono perspiciatis aegrotatio sophismata urbs temeritas adimpleo aduro. Suspendo solium civitas quidem acceptus sodalitas decor tracto eos. Nostrum creber ante cruentus tantum subvenio tubineus nesciunt. Admitto celer chirographum vere careo tempore abbas avarus capitulus. Acceptus tardus enim. Vitium vulgo eos celo crux succurro blanditiis tot temptatio bestia. Denego carus sed strenuus tribuo celer vapulus. Astrum certus acer vere cado thema repudiandae. Tripudio ater benigne. Coruscus temporibus cohibeo magni labore apto dedecor vae sordeo. Aliqua bestia aufero attero atrocitas bos subvenio cura cilicium. Voco cito ipsam rem. Agnitio aureus creator clam dolorem. Conduco calculus vito incidunt aspernatur vulgus. Amoveo absorbeo surgo agnosco tabesco aro repellendus comitatus.

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