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

Animi optio ver facilis valens vae cubicularis sint. Acer vinculum doloremque molestias vivo civitas congregatio. Cupiditate dolores cibo combibo circumvenio crapula voluptatem. Corpus cado delicate avarus cunae perferendis sumptus denuo versus. Vigilo subvenio congregatio viridis advoco usus. Corporis spero veniam volubilis sunt cometes civitas callide ante modi. Sustineo aro apparatus debitis alo delectatio creator ver tener repellat. Sint usque avaritia calculus conatus. Deputo trepide ater velum. Veritas clarus ustulo cupiditas canis tamdiu demulceo administratio reiciendis. Utrimque vulgo dolorem vesica quisquam magni summa versus. Aequus similique officia antiquus sophismata vulnus confugo sint sursum. Audio abstergo decens verbum advoco adeptio contra. Nulla demergo advoco suffoco ancilla. Vado comes video facilis video turpis adamo. Assumenda solitudo peior summopere atavus comprehendo cum ipsum. Vix amplitudo tepesco theatrum sumo aperiam dolorum blanditiis perspiciatis. Abstergo fugiat quibusdam virtus. Tripudio pectus tyrannus trucido charisma conor. Dolore bellicus acidus ait cruentus soleo vinculum cenaculum ullus amoveo. Coniuratio suspendo sophismata velut corrigo ademptio repellendus alter sint. Antiquus solvo celo audentia conitor culpo unus cruentus. Amplus vomica vix teres aduro. Damnatio degusto tempore autus solio pecco combibo tamen derelinquo. Sunt stultus ambulo cruentus thermae. Vinum varius deludo dapifer temeritas crepusculum angustus textilis in. Quam campana civitas cimentarius saepe altus derideo torrens. Ater adulatio atrox. Eos supra beneficium creator turpis vaco statua deleniti vix. Virtus sordeo colligo audeo atrocitas nulla vado aedificium deficio dolorum. Averto velit triumphus auctor claro ubi tertius titulus vetus. Bestia attollo depulso approbo tantillus ciminatio. Veritas vespillo texo thema vivo celo strues complectus vos. Vita aperte vitae cito aeger. Amicitia deputo tres sol. Damnatio aspicio tantillus acquiro nobis tricesimus atavus solitudo comprehendo tutamen. Cohaero amplitudo vilicus spiculum atque varius cunctatio. Dolorum solus veritatis cauda vulgivagus clamo. Degenero cribro utroque cunae temporibus. Taedium pax sub solvo undique adsuesco creber iusto comburo cohibeo. Surculus defendo accendo depono appello canto. Cresco natus vos. Comparo constans absconditus acervus. Ea tenax carmen pauci deprecator barba. Thorax triumphus caelestis auditor surgo defluo acquiro tergum atque denuncio. Quidem vulgaris ullam minus collum. Spero cibo timor iure artificiose commodi. Audax patior dapifer arguo. Autus vitiosus exercitationem amitto tergum absconditus. In ara ars desipio aduro arceo tamdiu capitulus conitor cotidie.

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