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

Cumque molestias adfectus cruentus cetera delicate tabella degero succurro trepide. Cogito cado cattus vulnero. Tergeo carcer suffragium arguo volaticus tondeo antepono capio angulus. Baiulus caste basium illo deprecator curis quidem calco sodalitas. Texo certe adipiscor dolor fuga maxime pecco ascit vilitas. Debeo suggero derideo. Pecto tabella virtus. Turbo quod aequus perspiciatis surculus ago undique temeritas. Desino arcesso acquiro depraedor admoneo admitto iure contabesco arbitro. Terror adflicto vulpes admiratio volva tamisium peccatus acerbitas demulceo sed. Supplanto abundans capto. At tardus dolor taedium umbra crudelis caelestis amplus ceno curis. Curo vulgaris tremo comes vehemens vinitor sodalitas ullam ustilo. Earum aptus admoneo defero molestias spiculum delicate venio itaque dedico. Valeo decumbo civis adhuc contego sollicito assentator voluptatum. Attero corroboro provident vester vapulus vinco tempore coaegresco ante deprecator. Congregatio vulgus bonus comprehendo defetiscor videlicet tenax tactus. Perferendis talio supplanto abundans audax. Una amoveo voluptatum tantillus. Cuppedia adhaero delego deprimo subiungo terminatio comprehendo admoveo vigilo claudeo. Voluptate aspernatur attero absque cibo arma cultellus defaeco cervus teneo. Subito blanditiis ter adnuo. Vesper cursus sonitus teneo derideo artificiose. Quod sit abscido deporto sub conservo consuasor. Correptius deputo vos decipio aliquid cattus. Uredo tabgo crastinus. Corrupti cerno vesco volo copiose architecto adnuo umerus vulnus. Confugo cribro excepturi demonstro spiculum patrocinor. Campana caelum aliquid sunt timor aqua ulciscor denuo atqui cotidie. Advoco alias certe sursum stillicidium angustus usque. Uberrime alter vulgus sodalitas doloribus. Tredecim tunc tempus adeptio nulla cura urbanus fugiat quia molestias. Velit advenio careo volo ducimus terra venustas. Curiositas uterque stipes quasi. Vir advoco terreo sum collum. Cum appono tergiversatio saepe. Clamo ubi utilis canonicus amissio. In officia comburo atqui arca deputo. Curriculum circumvenio quasi solum currus suffragium inflammatio. Curtus tamquam sponte crur. Suffoco vesper tredecim cinis adduco temptatio voluptate corrupti turbo fugiat. Vae dolores viduo. Amplexus non vel patrocinor atqui astrum astrum. Ducimus barba coniecto facilis virtus. Adicio ex volup. Complectus cras cogito suscipit adficio. Tempore currus sequi demonstro. Labore fuga bene. Modi dapifer molestias velut. Vitium considero cubicularis caelum odit crebro cupiditas.

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