Skills
.Work. You
Rest

arcanea-design-system

Community

Define a cosmic UI language with consistency.

Authorfrankxai
Version1.0.0
Installs0

System Documentation

What problem does it solve?

This Skill provides a complete visual language for Arcanea, ensuring magical and accessible interfaces across features, tokens, typography, spacing, and components for Academy ecosystems.

Core Features & Use Cases

  • Cosmic Foundations: Dark backgrounds with luminous accents, glass surfaces, glow, and tokens that unify UI across products.
  • Typography & Spacing: Consistent type scale and spacing system.
  • The Academy Palettes & Theming: Distinct Academy color palettes to contextualize domain work (Atlantean, Draconic, Creation & Light).
  • Use Case: A product team ships multiple Arcanea tools with a single design language, reducing design debt and accelerating onboarding.

Quick Start

Import the design tokens and patterns, then apply the base classes (cards, buttons, inputs) to begin building Arcanea UIs.

Dependency Matrix

Required Modules

None required

Components

Standard package

💻 Claude Code Installation

Recommended: Let Claude install automatically. Simply copy and paste the text below to Claude Code.

Please help me install this Skill:
Name: arcanea-design-system
Download link: https://github.com/frankxai/arcanea/archive/main.zip#arcanea-design-system

Please download this .zip file, extract it, and install it in the .claude/skills/ directory.
View Source Repository

Agent Skills Search Helper

Install a tiny helper to your Agent, search and equip skill from 223,000+ vetted skills library on demand.