kortix-design-system

Community

Build Kortix UIs with the official design system.

Authorjbreel77888
Version1.0.0
Installs0

System Documentation

What problem does it solve?

This Skill eliminates inconsistent, hand-rolled UI in Kortix's web apps that breaks brand identity, creates maintenance overhead, and leads to disjointed user experiences for end users.

Core Features & Use Cases

  • Strict Component Reuse: Enforces using pre-built design system components from the src/components/ui/ directory instead of hand-rolling custom UI chrome, reducing code duplication and maintenance work.
  • Brand Compliance Enforcement: Provides canonical rules for color tokens, typography, spacing, avatar shapes, and component patterns to ensure all UI matches Kortix's standardized brand identity.
  • Use Case: When building a new user settings page in the apps/web directory, use this Skill to ensure all panels, lists, form fields, and avatars follow design system rules, avoid hand-rolled components, and pass brand compliance checks.

Quick Start

Use the kortix-design-system skill to build a new project dashboard screen in apps/web that adheres to all brand, component, and token rules.

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: kortix-design-system
Download link: https://github.com/jbreel77888/Agent-AiNorx/archive/main.zip#kortix-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 536,000+ vetted skills library on demand.