Generate and apply OKLCH color themes with WCAG AA contrast compliance.
npx skills add https://github.com/PerceptLabs/wiggum --skill theming-perceptlabs
Please help me install this Agent Skill. Skill: theming Source: https://github.com/PerceptLabs/wiggum/tree/main/apps/ide/src/skills/theming Command: npx skills add https://github.com/PerceptLabs/wiggum --skill theming-perceptlabs
This Skill automates the creation and application of sophisticated color themes using the OKLCH color model, ensuring design consistency and accessibility across your project.
.ralph/tokens.json file with all design variables, contrast ratios, and personality data.Apply the 'retro-arcade' preset theme to your project.
High-intent search queries and answers about installing and using this skill.
You can generate OKLCH color themes using presets, sacred geometry patterns, or mood-based briefs. The system outputs a structured tokens file containing all design variables, contrast ratios, and personality data for direct application to your web project.
Yes, this approach integrates with Tailwind CSS v4 to enable dynamic theming. It automatically applies generated OKLCH color palettes to your project, managing design tokens, font pairings, shadow profiles, and radius settings directly within the framework.
WCAG AA contrast compliance is ensured automatically during the OKLCH theme generation process. The system calculates and embeds specific contrast ratios within the structured design tokens file, verifying foreground and background colors meet accessibility standards.
Managing design tokens is best handled by generating a centralized `.ralph/tokens.json` file. This file consolidates all design variables, font pairings, shadow profiles, radius settings, and contrast ratios to maintain visual consistency across multiple UI components.
Yes, you can apply a preset theme and easily modify it to fit your brand's specific needs. You can use mood-based customization and CLI commands to adjust colors, fonts, and shadows until the aesthetic aligns with your requirements.
Perform detailed design analysis on your CSS theming configuration using dedicated CLI commands. These commands evaluate your generated OKLCH color themes, design tokens, and overall aesthetic alignment to provide actionable feedback on your project.
djankiesMigrate Tailwind CSS v3 projects to v4 by converting JS config to CSS.
billydeeii136Generate UI components using shadcn/ui and Tailwind CSS utility classes.
systempromptioEnforce branded visual design consistency using OKLCH tokens and fluid typography.
ngochuy13Generate accessible brand and UI color palettes with WCAG contrast ratios.