Theme Toggles

screenshot of Theme Toggles

Theme Toggles

Theme toggles is a collection of awesome, easy to use, animated toggles; designed for switching between light and dark modes. It's a modular library which aims to provide an ample customization where needed. Works great utility CSS frameworks such as Tailwindcss.


The v5 branch of Theme Toggles is a complete refactor of the library. It provides a quick and effortless way to implement well-designed toggles for websites that support light and dark themes. The library uses SVG icons that are animated with CSS, allowing for minimal markup and scalability.


  • Tiny Size: The library is incredibly lightweight, with a minified and gzipped size of only around 1.5kb.
  • Accessible: Theme Toggles ensures that the toggles are accessible, making them usable for all users, including those with disabilities.
  • Customizable: The library allows for customization, allowing developers to tailor the toggles to match the design and branding of their websites.


To install the latest version of Theme Toggles, you can use either npm or yarn. Here are the installation commands:

npm install theme-toggles@latest


yarn add theme-toggles@latest

In addition, if you're using React, you can install the React-specific version of Theme Toggles. Here are the installation commands for that:

npm install @theme-toggles/react@latest


yarn add @theme-toggles/react@latest


Theme Toggles v5 is a library that provides an easy way to implement well-designed toggles for websites supporting light and dark themes. The library is lightweight, accessible, and customizable. It uses SVG icons animated with CSS, resulting in minimal markup and scalability. Installation of the library can be done through npm or yarn, with an additional React-specific version available for those using React.


Next.js is a React-based web framework that enables server-side rendering, static site generation, and other powerful features for building modern web applications.


React is a widely used JavaScript library for building user interfaces and single-page applications. It follows a component-based architecture and uses a virtual DOM to efficiently update and render UI components