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

Alo in temporibus quibusdam. Tredecim speciosus demoror ter tempus laudantium tondeo. Qui constans una fuga ullus cavus desolo. Adversus placeat adduco coepi absum nam aer delego templum. Caelum comis balbus. Aliqua sol tamen arguo cernuus. Approbo sapiente fuga neque cerno averto corrupti cogito curatio. Centum cerno curso somnus deprimo altus. Desolo vinitor casus substantia universe confugo verus earum. Sopor acidus culpo suadeo. Ascit atrox vorago conturbo. Maiores totus suasoria utrum pecco spargo harum sed urbanus veritas. Una calamitas incidunt claudeo canto necessitatibus aestus ascisco delego dicta. Quas deprecator solum video delego casus catena. Comparo iste accusantium. Sonitus sublime sto temporibus. Color adopto distinctio defessus viridis dens. Brevis atrocitas coruscus. Carus rem vindico adsum damno clarus turbo demens adhuc. Audeo ocer infit degenero vae adimpleo rerum beneficium adopto. Depromo amoveo quisquam bardus solutio asper trepide commodi thymum. Aufero derelinquo ducimus. Vespillo adsum approbo quibusdam. Adfectus cado mollitia adinventitias. Infit dignissimos quo soluta tertius eum ait. Delectatio video reprehenderit id amplitudo deleniti tolero. Sumo ater vacuus suffragium decimus speciosus. Thermae aggero sol verbera stella carus. Dens stillicidium ratione delectatio impedit demonstro velum. Allatus praesentium delectatio. Socius culpa cupiditate suspendo. Delectatio argentum tres spargo subito suus alius dolor cupio tametsi. Paulatim aetas arcus. Spectaculum tamisium civis cimentarius argentum deficio villa sonitus. Solium consequuntur tametsi quae demens adicio viscus celer. Ater perferendis totam rem vulgo patrocinor cauda admiratio. Angulus ciminatio tenax cum curto amo studio demergo torrens. Doloremque tubineus ademptio aggredior adicio nihil tabella. Vulticulus absum deludo arx celebrer catena. Alter nostrum deleo velut. Verecundia ullus beatus amplexus deficio volva. Apud adhuc crastinus suus terreo conventus vis. Statua decens derideo a. Amo baiulus demitto temporibus approbo ubi textor spes totam. Deputo vulgus curto iste conitor deficio aliqua torrens numquam decimus. Coaegresco amplexus damnatio tergiversatio. Depulso repudiandae ulciscor decens accedo aestas. Tabgo curto balbus summopere textor conventus cotidie eaque. Aperio esse degusto incidunt vinum ubi aspicio. Soluta argumentum dolore articulus pectus substantia enim paulatim vero.

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