skills.rest
anolilab
anolilabOFFICIAL
Explore all skills by this author →
WebsiteGitHub

lunora-design

Enforce Lunora design guidelines for typography, color, and component composition.

214|7|Updated May 29, 2026
Search Tags:#typography#design#ui#components#ux#geist#lunora
One-click install
npx skills add https://github.com/anolilab/lunora --skill lunora-design
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: lunora-design
Source: https://github.com/anolilab/lunora/tree/main/.agents/skills/lunora-design
Command: npx skills add https://github.com/anolilab/lunora --skill lunora-design

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

This Skill solves the problem of maintaining visual consistency and brand alignment when building interfaces for Lunora-based projects, preventing generic or off-brand UI choices.

Core Features & Use Cases

  • Design System Enforcement: Provides strict rules for typography, spacing, and color usage based on the Lunora brand.
  • Component Guidance: Offers precise specifications for cards, buttons, inputs, and data visualizations.
  • Use Case: When building a new dashboard, use this Skill to ensure your layout follows the three-layer hierarchy, uses the correct Geist font weights, and applies the aurora ribbon accent only where appropriate.

Quick Start

Apply the Lunora design system to the current dashboard component using dark mode.

Frequently Asked Questions about lunora-design

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I enforce consistent UI typography and color rules in a design system?▼

To enforce consistent UI typography and color rules, apply strict design language guidelines that specify monochromatic hierarchy, font weights, and component composition for visual brand alignment.

What is the best way to apply the Geist font and aurora ribbon accent to dashboard components?▼

Applying the Geist font and aurora ribbon accent requires following specific structural chrome styling and component guidance rules to maintain a three-layer hierarchy across dashboard interfaces.

How do I style UI components like cards and buttons to match a strict brand identity?▼

Styling UI components like cards and buttons to match a brand identity involves using precise design system specifications for spacing, color usage, and structural chrome styling.

Can I use this design system approach for both light and dark mode UI development?▼

Yes, this design system approach supports dark mode UI development by providing adaptable monochromatic hierarchy and component composition guidelines that maintain visual consistency across modes.

When do I need strict design language guidelines for UX development?▼

Strict design language guidelines are needed for UX development when building interfaces that require adherence to specific brand identities, preventing generic or off-brand UI choices in projects.

Related Skills

Explore More Design & Creative Skills→
yonatangrossyonatangross
3

design-system-starter

Generate design tokens, atomic components, and documentation templates for UI systems.

Community
Advanced
JiminLee-wayJiminLee-way

krds-components

Deliver ready-made KRDS UI components with HTML snippets and ARIA semantics.

Community
Advanced
vercelvercel
246

geist

Configure Geist Sans, Mono, and Pixel fonts in Next.js layouts with next/font and CSS variables.

Official
Intermediate
Tea-4-LifeTea-4-Life

frontend-design

Create production-grade frontend interfaces with cohesive design systems and accessible tokens.

Official
Advanced