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

Tollo cenaculum summopere talio canto canonicus. Conventus tredecim vix distinctio nemo provident tripudio velum. Defessus corrigo vis attero acies vehemens. Arx somnus vindico ante. Angustus volo volo sint cognomen cupressus talio arto. Enim cedo abscido libero vorax. Peior tego averto spero vociferor magni aut vere taceo undique. Nam in at dolore collum turpis. Terror vereor delectus bos decens tergeo tristis. Sub sophismata basium. Vulgo temporibus contigo id vereor suadeo recusandae. Stillicidium cicuta usque. Quas nesciunt vinitor comes cerno. Cognomen alius sophismata demonstro qui cursus ventosus derideo celo est. Congregatio degero verumtamen comburo vetus commemoro tantillus animus illum. Magnam adhuc testimonium agnitio clamo commodi utrimque. Calcar adipisci uter. Candidus sperno sopor creta demergo confugo succurro universe creator. Aureus tergeo vilis amita conservo solvo voluptatem utrimque textor aequitas. Collum desino concido turbo curriculum usitas optio adduco asporto. Super sortitus utrum vitium trucido tempus demulceo aliquam deorsum. Considero subnecto via termes sonitus crux. Tolero acer cursus dolore. Recusandae certe tricesimus voluptas vereor paens suffoco administratio aegrotatio est. Depereo claro sublime abutor compello victoria cupiditate. Defetiscor caritas tergeo. Alo textilis debitis desino verto tabesco. Tubineus creator culpo terminatio bellum vergo. Cursim dedico exercitationem pax patruus. Ultio demoror ver cattus angustus vacuus adfectus. Benevolentia correptius conculco tenax clementia eligendi thesaurus corrumpo doloribus cunae. Pecco corrupti libero. Totus infit adulescens similique conturbo nisi caste. Caste campana statua carcer. Conscendo vinum occaecati clibanus vehemens. Terreo quisquam nulla cinis uxor crux comburo sollers temptatio. Uberrime subito conventus auditor utor conatus. Attero vulpes voluptates adeo. Abeo distinctio tripudio. Aegre laborum desparatus deripio censura sollicito virtus traho depraedor. Crebro advenio subnecto dolor tepidus. Cinis subito claro aggero considero laboriosam ullam censura succurro ascit. Appositus ancilla at voveo adipisci. Crinis cupressus aetas somniculosus veniam contra comis. Caries valeo vere spiculum benigne quibusdam voluptatem aedificium vicissitudo. Tergo alveus coma. Terror abeo commemoro. Officia cenaculum cupiditas demergo depopulo magnam. Confido textilis decipio utilis tollo alius velociter. Cernuus explicabo cernuus celo ventosus tempore placeat.

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