Templates

Custom CSS Styles

The fashion designers of the web, dressing up your code with the freshest swag.

Contributors for this component

Scrollbar hover effect in sidebar

@layer components {
    .scrollbar-active::-webkit-scrollbar {
        width: 6px;
        height: 6px;
    }
 
    .scrollbar-active::-webkit-scrollbar-track {
        background: transparent;
    }
 
    .scrollbar-active::-webkit-scrollbar-thumb {
        background: transparent;
        border-radius: 3px;
    }
 
    .scrollbar-active:hover::-webkit-scrollbar-track {
        background: transparent;
        border-radius: 3px;
    }
 
    .scrollbar-active:hover::-webkit-scrollbar-thumb {
        background: #818cf8;
        border-radius: 3px;
    }
}

Scrollbar design for other elements.

@layer components {
    .scrollbar-design::-webkit-scrollbar {
        width: 8px;
        height: 8px;
    }
 
    .scrollbar-design::-webkit-scrollbar-track {
        background: #e5e7eb;
        border-radius: 5px;
    }
 
    .scrollbar-design::-webkit-scrollbar-thumb {
        background: #818cf8;
        border-radius: 5px;
    }
}

toggles mobile menus