beautiful-ui
Beautiful UI
Build premium glassmorphism interfaces — dark-mode-first, with luminous glass surfaces, fluid animations, and meticulous visual polish using Next.js + Tailwind CSS v4.
Design DNA
Every interface follows these non-negotiable principles:
- Dark mode is the default — design for dark first, light is optional
- Glass is the primary surface — translucent layers with backdrop-blur over rich backgrounds
- Light is a material — use glows, gradients, and luminance to create depth
- Motion is intentional — every animation serves hierarchy, feedback, or delight
- Typography is bold — distinctive fonts, never generic (no Inter, Roboto, Arial)
Tailwind v4 Dark Glass Theme
@import "tailwindcss";
More from apetcu/skills
romanian-humanizer
Detect and remove AI-generated markers from Romanian text, making it sound like a native Romanian speaker wrote it. Use when asked to "humanize", "naturalize", or "remove AI feel" from Romanian text, or when editing .md/.txt files containing Romanian content. Identifies 26 patterns (12 Romanian-specific + 14 universal) and 4 style markers.
4demo-builder
Build complete demo projects from scratch. Takes a project description (presentation website, shop, dashboard, SaaS, portfolio, etc.) and scaffolds a full working Next.js + Tailwind CSS 3.4 app ready for Vercel deployment. Supports optional database integration when a DATABASE_URL is provided. Use when the user wants to build a demo, create a project, scaffold an app, prototype something, or spin up a quick site.
3beautiful-diagrams
Generate beautiful article diagrams using HTML + Playwright. Five layouts: pipeline (horizontal flow), sequence (actors + messages), grid (2-col cards), stack (numbered hero cards), comparison (before/after). Bold white carousel style with thick black borders, terracotta accents, chunky rounded cards, and LARGE Inter 900 typography. Use when creating architecture diagrams, sequence diagrams, numbered lists, before/after comparisons, or any visual for articles. Triggers: 'create diagram', 'generate diagram', 'make architecture diagram', 'build sequence diagram', 'numbered list diagram', 'comparison diagram', 'create a visual', 'diagram for article'.
1