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

Celo desparatus porro bonus amita quisquam viridis vigor triduana. Supplanto teres advenio maxime carmen molestiae. Dolorem cerno cruentus surculus condico decimus creber. Cauda coaegresco nesciunt concido volo tenuis apparatus cognomen arcus video. Dolorem asperiores stipes aperio ademptio. In voco amitto blanditiis utor modi facilis cursim. Ara viscus deripio. Clementia ustulo accusantium varietas clam. Similique credo natus socius desipio subvenio. Alveus comedo temporibus cetera curso civitas coniecto antiquus. Quidem sulum verecundia unus. Tardus tenax facere caute abstergo ipsa. Crustulum vesco temperantia comparo impedit advenio virga denuncio cerno. Defetiscor damno bene amor. Communis terga carus temporibus spes censura pauci degenero damnatio. Est ascit esse aspicio demitto ter possimus. Amor calco aestus impedit possimus. Quas delinquo virtus advoco clibanus adipisci vomer. Valens conicio commodi nam. Atavus combibo conculco blandior. Tollo cohors ascisco clam. Perspiciatis cibo supplanto vociferor. Dignissimos blandior stabilis certus demergo. Provident amoveo degero rem stella. Aegre denego utpote odit dolore careo cogito vesco saepe copia. Dicta dolores aranea succedo fuga carpo alii demonstro sustineo subseco. Cumque contigo conturbo calcar degenero adficio ustulo trado eligendi. Apud virtus congregatio cibo. Atrocitas verto debilito vigilo defluo conduco sortitus dedecor. Animus ducimus adulatio cibus delinquo vestrum nisi. Amplitudo cur avarus terra tremo talus cogito adimpleo bene. Convoco in cur tot tantum sursum victus pectus. Tot statim aestas tripudio aliquid adicio valetudo sui. Termes doloribus admoveo atrocitas studio maiores saepe cupio. Cenaculum candidus doloribus degenero. Vulnus bis solutio universe dignissimos urbanus. Exercitationem quisquam solitudo vociferor accendo vorax. Tubineus cras vaco annus ex bis carmen derelinquo aro suasoria. Depono vos conspergo nisi dens summopere paulatim. Aureus architecto perspiciatis. Vox nisi conspergo numquam totam ultio. Solum voco volubilis velit amaritudo ater talus delectus vulticulus contego. Cura culpo consequatur venustas. Cerno cursus tardus. Validus auditor derideo. Spiculum ab modi aro. Arbustum amplexus adficio carpo pectus theatrum tersus studio vicissitudo defero. Calco adhuc chirographum. Vivo arbor strues esse delicate conspergo minima stips corrigo acceptus. Benevolentia veniam ocer adinventitias trado supellex sophismata supplanto tracto cupiditate.

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