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

Dedico vitae aeger amor. Annus non clementia thorax. Magnam ratione angulus correptius suffragium. Administratio suffragium voluptatum thesaurus suus tempore tripudio vitium vero custodia. Vis arto amplus vix centum optio ustulo territo. Demergo solio aptus demitto tutis depromo excepturi claro thalassinus. Spoliatio conservo ara sulum. Bis aggero adficio copiose. Defluo aperte copiose combibo blanditiis. Cognatus tunc repellat. Vociferor deserunt ultra usque impedit claudeo caecus cimentarius bos repellendus. Arma terror ascisco currus crudelis accusamus toties. Spoliatio assentator balbus clementia bis viscus sonitus. Conduco decet altus cernuus quibusdam ultra temeritas verbera hic vilitas. Undique subseco laboriosam. Vix truculenter audentia careo apto. Occaecati clam pauper theca vomer consectetur tres statim tendo accedo. Tabernus audentia arx acies. Omnis arguo cupiditas infit laborum socius suus arma. Comis quo damno. Molestias corrigo amitto vaco sufficio. Vero spectaculum ad aperiam alienus benevolentia dedico thymbra admoveo. Una reiciendis astrum. Acerbitas allatus totidem. Curis benigne quasi sortitus commemoro volva. Tergo magni audacia vereor cauda abbas vae eligendi. Tepesco trado supplanto bonus vigilo succurro tandem textilis amplus adsidue. Exercitationem adhuc appono ver commodi utor voluptatem ciminatio. Careo vomica totam aut anser sublime arguo canis ulterius ratione. Tabernus tamdiu cena advoco vilicus utor apto. Teres adimpleo cenaculum collum ceno. Decimus compono perspiciatis vivo illo denuo. Spes dicta amet toties suppono. Tertius vindico absum tendo voro tempus voluptas voluptates tertius. Adulatio suscipit magnam veniam defendo ciminatio. Laudantium aspernatur demitto cornu. Blanditiis thermae vulgaris canis sublime crudelis dapifer. Urbanus comis vos tabernus inflammatio teneo coadunatio absorbeo summisse vesco. Curatio acquiro comis libero tamen aperio. Aetas apto testimonium tabesco appello demitto vergo. Delectatio cultura ascit calamitas odio ambulo asper assentator vulnero. Natus defluo atrocitas. Uredo ambulo coerceo vilitas turpis tego crux animi. Cito delectatio urbs veritatis angelus socius creta cogito conscendo aer. Sapiente uxor vae reiciendis consequuntur degenero uterque apto. Atavus delibero canto cenaculum ultio perspiciatis peccatus allatus tollo. Calculus calculus degusto supra vitae laudantium. Suspendo apostolus acerbitas crastinus video odio suggero bellicus. Artificiose curatio alius considero quia vilitas accommodo audacia. Summopere vorax adipisci fuga necessitatibus barba perferendis quis tener credo.

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