Seeed-Solution/csg-design-system
Agent Claude Code
Generates React + CSS Module components from the CSG Design System spec. Use when you need a component that matches the SenseCraft AI design system exactly.
Seeed-Solution/csg-design-system
Agent Claude Code
Audits code and UI implementations against the CSG Design System spec. Returns a structured PASS/WARN/FAIL report. Use for design review before merging UI changes.
Seeed-Solution/csg-design-system
Agent Claude Code
Syncs the CSG Design System (DESIGN.md) with the Figma source file. Extracts colors, typography, spacing, and component specs from Figma and updates DESIGN.md. Use when the Figma file has changed and DESIGN.md needs to catch up.
Seeed-Solution/csg-design-system
Agent Claude Code
Use when building complete frontend applications across React, Vue, and Angular frameworks requiring multi-framework expertise and full-stack integration. Follows the CSG Design System defined in DESIGN.md.
Seeed-Solution/csg-design-system
Agent Claude Code
Updates CSG Design System tokens and components in DESIGN.md. Use when adding new color tokens, updating component specs, or extending the design system with new sections.
Seeed-Solution/csg-design-system
Agent Claude Code
Replaces hardcoded style values in an existing project with CSG Design System tokens from DESIGN.md. Scans the full codebase, imports tokens, swaps values, and generates a migration report.
Seeed-Solution/csg-design-system
Agent Claude Code
Use this agent when designing visual interfaces, creating design systems, building component libraries, or refining user-facing aesthetics. Follows the CSG Design System defined in DESIGN.md and extends it when new patterns are needed.
Seeed-Solution/csg-design-system
Agent Claude Code
Use this agent when you need to translate a DESIGN.md from the VoltAgent/awesome-design-md repository into polished Claude Code instructions for building user interfaces that faithfully match the chosen brand. Invoke this agent whenever a developer or designer asks to replicate the look and feel of an existing product…
Seeed-Solution/csg-design-system
Cursor rule Cursor
Generates React + CSS Module components matching the CSG Design System (SenseCraft AI). Activate when building UI components, buttons, inputs, cards, modals, badges, or navigation.
Seeed-Solution/csg-design-system
Cursor rule Cursor
Audits React/CSS code against the CSG Design System. Activate when reviewing UI code, checking design compliance, or before merging frontend PRs.
Seeed-Solution/csg-design-system
Cursor rule Cursor
Syncs DESIGN.md with the Figma source file (QMSCzUBQ5hrq9Z3DNifY6Q). Use when Figma designs have changed and the spec needs updating.
Seeed-Solution/csg-design-system
Cursor rule Cursor
Updates design tokens, components, and sections in DESIGN.md following the exact table format and naming conventions. Activate when editing or extending the design system spec.
At most 3 mods per repository are shown here, and a mod shipped inside a plugin is left to that plugin's page — the rest are on their repository pages: