ui.antraai.in Documentation

1. Philosophy: Source-First & Zero Runtime Bloat

Unlike traditional UI libraries that distribute compiled npm packages with rigid internal styling, ui.antraai.in is source-first. You copy the TypeScript and Tailwind CSS code directly into your codebase.

2. Quickstart & CLI Setup

Initialize ui.antraai.in in your existing Next.js project using our lightweight interactive CLI tool:

$ npx antraui init

Then add any primitive directly into your project:

$ npx antraui add voice-agent-orb

3. Tailwind CSS & Design Token System

ui.antraai.in uses a signature luxury forest dark palette (#0A180D) paired with high-contrast electric mint (#7DFFB3) and luxury editorial warm light (#F8F9EA). Add these CSS variables to your globals.css:

:root {
  --page: #F8F9EA;
  --surface: #FCFDF6;
  --accent: #003D22;
  --accent-ink: #7DFFB3;
  --line: rgba(0, 61, 34, 0.12);
}

.dark {
  --page: #0A180D;
  --surface: #122C19;
  --accent: #7DFFB3;
  --accent-ink: #003D22;
  --line: rgba(125, 255, 179, 0.12);
}

4. AI Prompt Engineering for Cursor & Claude

Every primitive in ui.antraai.in includes a handcrafted Markdown prompt optimized for LLM coding agents.

5. Web Audio Synthesized Haptic Engine

All tactile click and success audio feedback across ui.antraai.in is synthesized dynamically in the browser using the Web Audio API (OscillatorNode and GainNode). Zero static MP3 or WAV audio assets are required!