Skills
.Work. You
Rest

chi-components

Official

Explore Chi design system components.

Software Engineering#frontend#design system#css#components#web components#chi
AuthorCenturyLink
Version1.0.0
Installs0

System Documentation

What problem does it solve?

This Skill helps developers understand and utilize the Chi design system's components, ensuring consistency and adherence to design guidelines.

Core Features & Use Cases

  • Component Reference: Provides detailed information on Chi's CSS components, including their names, modifiers, BEM structure, and Web Component equivalents.
  • Modifier Exploration: Lists available modifiers for each component, allowing for customization and variation.
  • Web Component Mapping: Identifies the corresponding Web Component for each CSS component, facilitating modern development practices.
  • Use Case: A developer needs to implement a new alert message in their application. They can use this Skill to find the correct chi-alert component, discover available modifiers like -success or -banner, and learn how to use its Web Component equivalent <chi-alert>.

Quick Start

Use the chi-components skill to get information about the Chi button component.

Dependency Matrix

Required Modules

None required

Components

references

💻 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: chi-components
Download link: https://github.com/CenturyLink/Chi/archive/main.zip#chi-components

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.