메뉴
Updates the shadcn/ui theme by editing OKLCH CSS custom properties in apps/core/styles/tailwind.css. Use when the user wants to change colors, theme appearance, or match a brand palette.
Codex 또는 Claude로 설치 이 Prompt를 복사해 Codex, Claude 또는 다른 어시스턴트에 붙여 넣으면 Skill 페이지를 검토하고 설치를 진행할 수 있습니다.
SOC 직업 분류 기준
Creates a new UI component with implementation, index, tests, and Storybook stories following PageZERO conventions. Use when adding a UI component or when the user asks to scaffold a component in packages/ui or apps.
Create GitHub pull requests following conventional naming patterns, creating a branch if needed. Use when the user asks to create or open a PR, submit changes for review, or push work to GitHub.
Squash-merge the open pull request for the current branch and clean up the branch, only when that PR exists and all checks pass. Use when the user asks to merge a PR, finish a PR, land a PR, or complete a pull request from the branch they are on. Never ask for a PR number; the skill applies only to the PR tied to the checked-out branch.
| name | change-theme |
| description | Updates the shadcn/ui theme by editing OKLCH CSS custom properties in apps/core/styles/tailwind.css. Use when the user wants to change colors, theme appearance, or match a brand palette. |
Modify the shadcn/ui theme by updating CSS custom properties in apps/core/styles/tailwind.css.
Ask the user in a single question:
What theme style would you like? (e.g., "blue primary color", "warm and rounded", "minimal with sharp corners", or a specific hex color to match)
The theme is defined in apps/core/styles/tailwind.css with CSS custom properties using the OKLCH color space.
The file contains three main sections:
:root - Light mode colors (lines 73-106).dark - Dark mode colors (lines 110-142)@theme inline - Tailwind color mappings (lines 33-69)| Variable | Purpose |
|---|---|
--background | Page background |
--foreground | Default text color |
--card | Card backgrounds |
--card-foreground | Card text |
--popover | Popover/dropdown backgrounds |
--popover-foreground | Popover text |
--primary | Primary brand color (buttons, links) |
--primary-foreground | Text on primary color |
--secondary | Secondary actions |
--secondary-foreground | Text on secondary |
--muted | Muted backgrounds |
--muted-foreground | Muted/subtle text |
--accent | Accent highlights |
--accent-foreground | Text on accent |
--destructive | Error/danger states |
--border | Border colors |
--input | Input field borders |
--ring | Focus ring color |
--radius | Border radius base value |
--chart-1 to --chart-5 | Chart colors |
--sidebar-* | Sidebar-specific colors |
Colors use OKLCH format: oklch(lightness chroma hue)
When the user requests a theme change:
:root (light) and .dark sections