open-props

Import modular CSS custom properties for design systems.

1|Updated Dec 26, 2025

Search Tags:#theming #css-variables #design-tokens #css-patterns #open-props

One-click install

npx skills add https://github.com/ProfPowell/project-template --skill open-props

Or copy as Structured Prompt for Agent▼

Please help me install this Agent Skill.
Skill: open-props
Source: https://github.com/ProfPowell/project-template/tree/main/.claude/skills/open-props
Command: npx skills add https://github.com/ProfPowell/project-template --skill open-props

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Open Props provides battle-tested CSS custom properties for rapid design systems without heavy tooling.

Core Features & Use Cases

Modular Imports: Pick only needed modules.
Token Mapping: Align tokens with your own design system.
Dark Mode: Leverage token-based theming (OKLCH/HEX variants).

Quick Start

Import colors.min.css and sizes.min.css to start reusing tokens.