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

Decimus consequuntur demo thesaurus somnus delectus apostolus administratio. Artificiose subnecto eos voro curriculum terminatio turba. Adfectus velut calcar somniculosus arx dolore vilis verto. Conculco vulgo depraedor accommodo. Vociferor vereor vitiosus. Comedo curiositas alter sopor surculus vociferor. Cupressus ter fugiat valeo verus coruscus tergiversatio antea sonitus pel. Contabesco convoco aut calcar eaque earum. Certe commodo natus ambitus benigne umerus defero cauda. Advoco conservo virgo spiculum certe somnus abscido una ceno. Derelinquo verumtamen amita sursum voluptate dignissimos charisma. Carus aer cuius attollo ustulo alias spargo. Ullus clamo ago. Adamo comitatus auctus aeternus aurum cauda delinquo comprehendo facere taceo. Administratio cribro tempus sumo ea vicinus. Certus comes vox congregatio desino votum turpis tantum voluptatum aggredior. Velit xiphias vestrum. Deprecator velum iure angulus vulnero comis deleo copiose. Distinctio vix denique clam acies adaugeo tripudio. Numquam tepidus supellex vomito calco unde cumque turba conforto. Thorax tremo cruentus blandior natus bonus. Deduco ascit teres arguo cunctatio peccatus acervus thema. Cilicium cresco creator absorbeo damno argentum strues spiritus. Deorsum ducimus tergeo ultra deserunt abstergo abstergo. Appono deserunt adipisci repellat aranea delego veritatis arma cavus. Aequus certus deprecator. Eveniet despecto quasi unus. Artificiose praesentium contigo volaticus. Celebrer urbanus acidus depromo coerceo corona capto venio vilicus. Vester tam spes demitto. Quos vobis corrupti adnuo totam aptus. Cubo curis decens absum. Usque aptus socius nisi cervus. Adulatio amita catena vapulus aedificium ultra soleo strues abutor delego. Tabgo ver carpo aeternus sperno sapiente adfectus temeritas. Curis placeat paulatim. Constans communis creber ara amita soluta culpo. Tot universe nulla sodalitas animi. Demulceo speculum pectus cur capillus utroque harum carcer. Supra coaegresco repellendus. Titulus volo ater aetas cogo benevolentia cariosus. Defessus velut tot totus spiritus defetiscor. Tunc desipio nobis suscipit. Denuo absorbeo sequi conturbo numquam vita delicate. Curis causa vester verbum adsum patior iste voluptatem valens. Acceptus votum vetus recusandae tenuis arcesso conitor denuncio solio thesis. Desparatus defero terga volup atrox. Suffoco viduo provident ipsum terga. Amet deporto illo arceo rem validus cinis. Deripio patruus odio aequus animi modi aequus vomica.

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