aniq-ui

Aniq UI

The Ultimate Dark-Themed UI Library for React & Next.js

Installation

npm install aniq-ui
# or
yarn add aniq-ui

Setup

No additional configuration required! Aniq UI components come with their styles included.

Usage with Tailwind CSS v4

This library is compatible with Tailwind CSS v4 but doesn't require it to be installed in your project. If you're using Tailwind CSS already, our components will integrate seamlessly with your design system.

import { Button } from 'aniq-ui';

export default function MyComponent() {
  return (
    <Button variant="primary">Click me</Button>
  );
}

Dark Mode Support

Aniq UI components automatically support dark mode. Just add the dark class to any parent element to enable dark mode styles:

<div className="dark">
  <Button variant="primary">Dark Mode Button</Button>
</div>

Component Styling

Components are styled using CSS Modules with Tailwind's @apply directives, making it easy to maintain and update styles while leveraging Tailwind's utility classes.

Available Components

Button

import { Button } from 'aniq-ui';

// Available variants: 'default', 'primary', 'destructive', 'outline', 'ghost'
// Available sizes: 'default', 'sm', 'lg', 'icon'

<Button 
  variant="primary"
  size="default"
  leftIcon={<IconComponent />} 
  rightIcon={<IconComponent />}
  onClick={() => alert('Clicked!')}
>
  Button Text
</Button>