风格描述
零运行时 React 组件库,专为 Tailwind CSS v4 + React 19 设计
标签
Ninna UI前端框架
提示词模板
基础模板
Design a Ninna UI-inspired interface. - Zero-runtime theming: no ThemeProvider needed, pure CSS import; - 69 components across 12 tree-shakeable packages; - 5 oklch-based theme presets: Default, Ocean, Sunset, Forest, Minimal; - WCAG 2.1 AA accessibility on every component; - React 19 compatible with forwardRef and TypeScript generics. Colors: #10B981, #3B82F6, #F59E0B, #EF4444 with #10B981 accent. Typography: system-ui.
变体提示词
📱 移动端
Design a mobile app with Ninna UI aesthetics. Use Ninna UI color identity with #10B981 accents. Clean, touch-friendly, native feel.
💻 Web端
Design a web application with Ninna UI style. Use Ninna UI color identity with #10B981 accents. Professional, responsive layout.
📊 仪表板
Design a dashboard with Ninna UI design language. Use Ninna UI color identity with #10B981 accents. Data-rich, organized, clear hierarchy.
📄 落地页
Design a landing page with Ninna UI visual identity. Use Ninna UI color identity with #10B981 accents. Compelling, conversion-focused.
使用示例
Ninna UI React App
Web AppBuild a React 19 app with Ninna UI design language, zero-runtime theming, and #10B981 color system.
Ninna UI Dashboard
DashboardCreate a dashboard using Ninna UI style with oklch theme presets and Tailwind CSS v4.
✅ 适合场景
- Framework
- React 19 projects
- Modern web applications
✅ 不适合场景
- Unrelated design aesthetics
- Different brand guidelines