star-themetoggle
v1.0.1
Published
A beautiful React component for toggling between day and night modes with animated stars.
Downloads
95
Maintainers
Readme
Night Stars
A beautiful React component for toggling between day and night modes with animated stars.
Features
- Smooth transition between day and night modes
- Interactive star animations
- Customizable sun and moon icons
- TypeScript support
- Zero dependencies (except peer dependencies)
Installation
npm install night-stars
## Usage
```jsx
import { ThemeProvider, DaynightToggle } from 'night-stars';
function App() {
return (
<ThemeProvider>
<div style={{ height: '100vh' }}>
<DaynightToggle>
{/* Your content here */}
</DaynightToggle>
</div>
</ThemeProvider>
);
}
To use the theme state in your components:
import { useTheme } from 'night-stars';
function MyComponent() {
const { darkMode, toggleTheme } = useTheme();
return (
<button onClick={toggleTheme}>
Current theme: {darkMode ? 'Dark' : 'Light'}
</button>
);
}
Requirements
- React 16.8.0 or later
- react-dom 16.8.0 or later
- lucide-react
License
MIT