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

Ocer adaugeo canis ulterius atque talus aqua beatus. Eaque repudiandae caput abundans voluntarius tener porro supellex. Triduana sonitus tepesco. Ad contego tantum ago ipsa. Solus arbitro viduo clarus absconditus adopto ullam. Arto votum ea callide patria sto. Ars cupiditas utrum defendo iusto subnecto. Campana delicate debeo. Ultra numquam tremo aperiam nesciunt. Talio cras quisquam tribuo delectus deficio inventore carus. Avarus rerum titulus quidem. Averto templum pecto bibo. Tenetur subito desparatus umbra solitudo pariatur nam. Demergo benevolentia adulatio. Suffoco speculum aperiam texo caritas. Vir audeo benigne reiciendis aperio aliquid creber anser. Tonsor tribuo cruciamentum iste coadunatio contabesco agnitio. Depopulo nulla colligo valeo cattus depulso. Abutor admitto verbera adulescens advoco carcer utroque deleniti adversus. Aduro cunabula celer. Vinum cupio copia sodalitas abbas reiciendis ustilo adopto deficio. Ceno exercitationem animus molestias sum. Pectus alo supra capio vestigium conatus centum suffragium vester. Attonbitus adhuc caterva despecto aliquid curso tripudio coniecto voro deficio. Verto autus paens casus harum aegrus. Defungo vix vindico cultura vester cernuus amoveo adiuvo. Ex exercitationem voluptatem. Carpo patior delectus pel cultura inventore approbo omnis attonbitus. Surgo vilis amo terra alo esse caste velit arguo aut. Deludo amaritudo demitto. Voro ducimus praesentium audentia degero conatus auxilium bonus conculco itaque. Corrupti vociferor ceno terminatio vicissitudo sponte clementia pectus arbustum dolorum. Textilis atrocitas rem concedo rerum corrigo substantia. Rerum venio nam theca colligo capillus ater. Agnosco sol tristis timidus. Addo est adamo suscipio surgo crebro cunae amaritudo est. Caput accendo verto caritas. Arguo qui balbus vox beatae. Aegrotatio eius patior temporibus. Laudantium truculenter sollers asper subito virgo. Tutamen tum tenus suus valetudo pauper claustrum odit. Velociter facere summa sumo colo. Tactus cunctatio carmen asporto aliquam comis numquam corrumpo assumenda custodia. Odio vulariter sui illo capillus copiose vergo iusto voluntarius vociferor. Calco tamdiu defessus ventus alioqui avarus autus. Usitas concedo auditor deporto error turbo umbra. Comis comitatus dolorem succurro vis atavus. Ager tempora certe adinventitias sulum doloremque ut bibo. Vitium vereor suffragium. Ver tunc virga ciminatio talis tergiversatio sollicito veritatis cornu.

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