Getting Started

A beautiful neumorphism-styled component library built with React and Tailwind CSS.

Introduction

Neomorphism UI provides a collection of accessible, reusable, and composable React components that follow the soft UI (neumorphism) design trend. Each component features subtle shadows and gradients that create a soft, extruded look.

Quick Start

Import and use components in your project:

tsx

import { Button } from "@/components/ui/button"

export default function App() {
  return (
    <Button variant="default" palette="purple">
      Click me
    </Button>
  )
}

Design Tokens

The library uses a custom color palette and shadow system defined in your Tailwind configuration. Key tokens include:

bg-neu-white-1 - Primary background color for raised elements
shadow-neu-raised - Soft shadow for elevated elements
shadow-neu-pressed - Inset shadow for pressed states