brightness-system

Community

8-mode brightness with CSS tokens.

Authoromerakben
Version1.0.0
Installs0

System Documentation

## What problem does it solve? The Brightness System Skill standardizes how themes adapt across eight brightness modes, ensuring consistent color tokens and accessible UI across all UI changes.

## Core Features & Use Cases

  • Ensures 8 distinct brightness modes (-3 to +3 and auto) are consistently implemented across components using CSS custom properties.
  • Provides a token-driven approach to surfaces, text, borders, and brand colors to maintain WCAG-compliant contrast.
  • Use Case: When implementing a new theme or UI component, apply the brightness system to guarantee accessible styling across all modes.

### Quick Start To enable the brightness system, integrate the CSS tokens and brightness context, then control the mode via the root data-brightness attribute.

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: brightness-system
Download link: https://github.com/omerakben/omer-akben/archive/main.zip#brightness-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.