Does it support Tailwind CSS?

Yes, it includes deep integration with Tailwind v4, featuring custom brand tokens like TheGP orange, navy, and cream.

What is the gp-ui skill?

It is a specialized Claude Code capability designed to help developers build internal React applications using TheGP's official UI library and design system.

Which React primitives does it use?

The skill utilizes accessible Radix UI primitives for complex components such as Modals, Dropdowns, and Tooltips to ensure high accessibility standards.

How do I activate this skill in Claude Code?

The skill activates automatically when you mention @gp/ui, TheGP design system, or ask questions regarding internal GP-specific UI patterns.

TheGP Design System

Name: TheGP Design System
Author: thegpvc

bythegpvc

设计工具

Builds and migrates React user interfaces using TheGP's internal design system and Tailwind v4 integration.

关于

The gp-ui skill empowers developers to build, migrate, and maintain internal applications using TheGP's standardized React component library. It provides instant access to a comprehensive suite of UI elements—from basic buttons and cards to complex layouts and login pages—all pre-configured with TheGP's brand colors, typography, and Radix-based accessibility. By automating the implementation of design tokens and Tailwind v4 themes, this skill ensures visual consistency across the internal ecosystem while accelerating the development of accessible, high-performance web interfaces.

主要功能

0 GitHub stars
Seamless Tailwind v4 theme integration with brand tokens
Standardized icon sets and semantic class merging patterns
Automated migration to @gp/ui React components
Implementation of accessible Radix-based compound components
Responsive application layouts and shell structures

使用场景

Building a new internal application shell with the GP standard sidebar and header
Troubleshooting Tailwind v4 theme configuration and peer dependency issues
Migrating legacy CSS/HTML buttons and inputs to standardized @gp/ui components

关于

主要功能

0 GitHub stars
Seamless Tailwind v4 theme integration with brand tokens
Standardized icon sets and semantic class merging patterns
Automated migration to @gp/ui React components
Implementation of accessible Radix-based compound components
Responsive application layouts and shell structures

使用场景

Building a new internal application shell with the GP standard sidebar and header
Troubleshooting Tailwind v4 theme configuration and peer dependency issues
Migrating legacy CSS/HTML buttons and inputs to standardized @gp/ui components