Sansiv Themes

Sansiv Themes is a React component for dynamic theming with support for dark mode, default themes, and custom themes. It allows users to easily integrate theming into their projects.

Installation

npm install sansiv-themes

Usage

Basic Setup

Wrap your application with the SansivThemes component:

import React from "react";
import SansivThemes from "sansiv-themes";

const App = () => {
  return (
    <SansivThemes>
      <YourApp />
    </SansivThemes>
  );
};

export default App;

Access Theme Values

Use the useSansivTheme hook to access theme values:

import React from "react";
import { useSansivTheme } from "sansiv-themes";

const ExampleComponent = () => {
  const { themeValues, toggleTheme } = useSansivTheme();

  return (
    <div
      style={{
        backgroundColor: themeValues.sansivBG,
        color: themeValues.sansivTitle,
      }}
    >
      <h1>Dynamic Theming Example</h1>
      <button onClick={toggleTheme}>Toggle Theme</button>
    </div>
  );
};

export default ExampleComponent;

Features

Dark mode toggle
5 default themes
Custom themes with configurable colors

License

MIT