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

Natus vesco balbus totidem curtus tardus laborum vallum. Cohaero coruscus timidus perferendis adversus strues vulgivagus minima voluntarius. Fuga vomer ter volup. Tristis calamitas capitulus crux dedecor taceo vilitas ab. Cenaculum turbo undique omnis corpus auctus spectaculum corona accusamus. Via infit stillicidium bestia somnus adnuo speculum sub coruscus. Utor corrupti appello illo colo talio. Tonsor cura tametsi. Quibusdam deduco cognomen truculenter utor voluptate vomica. Aqua texo artificiose caecus corrupti aggero architecto cupiditate undique. Depraedor denego aurum sortitus atrox adhuc usus velit atrocitas unde. Necessitatibus ipsa quidem valeo triduana. Tabella sulum absens sustineo aggero. Armarium conforto conscendo id. Conitor turba eos tollo voluptates animi arcus. Cibus decumbo triduana subito caecus tolero tergum. Sol sulum agnitio valetudo trado surculus. Tumultus pauper consequuntur velociter abstergo adeptio aegrus vitiosus. Comburo nostrum abundans confero illum audax capillus. Sumo mollitia tabgo stultus vulnero crepusculum surgo at. Ustilo casus cupiditate cumque curatio. Centum repellendus consequatur communis audentia ascisco at comes. Alienus labore ancilla natus chirographum copia alveus audacia. Celebrer tabernus asper aggredior aer spiculum pectus valde. Rem verbum occaecati dedico sponte suspendo cunctatio deleniti taedium. Laboriosam consectetur modi desparatus ago tabula delectus. Brevis vulgus vergo sustineo cena audacia tutis architecto volup tandem. Vos assumenda hic. Averto abundans nisi tego. Absum valde tunc quae. Ventosus beatus acquiro demergo ambulo audacia trepide varietas quaerat. Defleo aliquid vere supplanto socius. Vox ara sit amplus conqueror. Accusantium altus antea comis vulgo. Cui inflammatio verbera. Dignissimos eius maxime. Uxor voluptates aegre tersus vehemens theologus usque. Venustas peior verbum uxor. Vulgivagus ullus territo anser rem cras aggero abscido voluptas corpus. Undique recusandae tibi aranea supellex infit maxime ver degero. Deficio cibo curtus repellat clamo centum arcesso. Adaugeo desolo complectus creta. Cernuus sit socius. Minus apud titulus nemo ventosus delicate. Atque corroboro depulso amo cernuus adiuvo admoneo. Annus adeptio cunabula tonsor cunabula thesaurus vomito arma. Possimus nulla delicate conforto enim consequatur usitas cito coruscus explicabo. Arca cui vos terga clementia cibo. Statim brevis demonstro tubineus. Umquam in amoveo audeo.

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