react-glass-ui 💎

🌐 Interactive Demo & Documentation

---

A strictly glassmorphism React UI component library.

react-glass-ui is a fully typed, heavily animated React component library built around the glassmorphism aesthetic — frosted glass surfaces, glowing borders, and soft depth shadows. Bundled via Vite with zero runtime dependencies.

---

Installation

npm install @dinakars777/react-glass-ui

---

Setup

Import the design tokens once at the root of your app (main.tsx or App.tsx):

import '@dinakars777/react-glass-ui/style.css';

---

Components

Button

import { Button } from '@dinakars777/react-glass-ui';

<Button variant="primary">Submit</Button>
<Button variant="outline" size="lg">Read More</Button>
<Button variant="ghost" fullWidth>Cancel</Button>

Prop	Type	Default
variant	"primary" | "outline" | "ghost"	"primary"
size	"sm" | "md" | "lg"	"md"
fullWidth	boolean	false

---

Card

import { Card } from '@dinakars777/react-glass-ui';

<Card glow>
  <h2>Glass Container</h2>
  <p>Frosted glass surface with optional glow.</p>
</Card>

Prop	Type	Default
glow	boolean	false

---

Input

import { Input } from '@dinakars777/react-glass-ui';

<Input placeholder="Enter your email..." />

Accepts all standard HTML <input> attributes.

---

Peer Dependencies

{
  "react": "^18.2.0 || ^19.0.0",
  "react-dom": "^18.2.0 || ^19.0.0"
}

---

Used In

• arch-to-code — Visual Terraform generator

---

License

MIT