DOCSEARCHbyAlgolia
Submit Docs

Toggles.dev Theme Toggles

website·Indexed 33 days ago

https://toggles.dev

A collection of animated dark mode toggle components for React, Svelte, and Vue, compatible with shadcn/ui.

Tokens
3.3K
Snippets
27
Records
27
Agent score
69%

What's inside Toggles.dev

  1. Install Simple Theme Toggle via shadcn/ui

    Install the Simple Theme Toggle component into your project using the shadcn CLI.
    npx shadcn@latest add @toggles/simple

  2. Install Classic Theme Toggle via shadcn/ui

    The Classic Theme Toggle is an animated dark mode toggle component. To install it in a project using shadcn/ui, use the shadcn CLI to add the component from the @toggles/classic package.
    npx shadcn@latest add @toggles/classic

  3. Install Horizon Theme Toggle via shadcn/ui

    Install the Horizon animated dark mode toggle component into your project using the shadcn CLI.
    npx shadcn@latest add @toggles/horizon

  4. Install Dark Side Theme Toggle via shadcn/ui

    Add the Dark Side animated dark mode toggle component to your project using the shadcn CLI.
    npx shadcn@latest add @toggles/dark-side

  5. Install Light Switch Theme Toggle via shadcn/ui

    Install the animated Light Switch dark mode toggle component into your project using the shadcn CLI.
    npx shadcn@latest add @toggles/light-switch

  6. Install Around Theme Toggle via shadcn/ui

    Install the Around animated dark mode toggle component into your project using the shadcn CLI.
    npx shadcn@latest add @toggles/around

  7. Install the Half Sun Theme Toggle via shadcn/ui

    Add the Half Sun animated dark mode toggle component to your project using the shadcn CLI.
    npx shadcn@latest add @toggles/half-sun

  8. Install Spin Theme Toggle via shadcn/ui

    The Spin Theme Toggle is an animated dark mode toggle component. For projects using shadcn/ui, you can add the component to your project using the shadcn CLI.
    npx shadcn@latest add @toggles/spin

  9. Install Eclipse Theme Toggle via shadcn/ui

    The Eclipse Theme Toggle is an animated dark mode toggle component. For React projects using shadcn/ui, you can install the component using the shadcn CLI.
    npx shadcn@latest add @toggles/eclipse

  10. Install the Within theme toggle component via shadcn/ui

    The Within component is an animated dark mode toggle available for React, Svelte, and Vue. For React projects using shadcn/ui, you can install the component using the shadcn CLI.
    npx shadcn@latest add @toggles/within

  11. Install the Lightbulb Theme Toggle via shadcn/ui

    The Lightbulb Theme Toggle is an animated dark mode toggle component. For projects using shadcn/ui, you can install the component using the shadcn CLI.
    npx shadcn@latest add @toggles/lightbulb

  12. Install Dark Inner Theme Toggle via shadcn/ui

    Install the Dark Inner Theme Toggle component using the shadcn CLI. This adds the animated dark mode toggle to your project components.
    npx shadcn@latest add @toggles/dark-inner