This is a scaffolding helper for building UI components in GPUI, the Rust-based GPU-accelerated UI framework from Zed Industries. It walks you through the standard patterns: whether to use stateless elements for simple stuff like buttons, stateful elements for data-heavy components like selects, or composition when building on existing pieces. The real value is in the guardrails. It'll push you to follow the existing codebase conventions in crates/ui/src, match Shadcn UI patterns for consistency, and remember the boring stuff like documentation and story registration. If you're contributing to a GPUI project or building internal component libraries, this keeps your components from feeling like they came from a different codebase.

skills.sh installs
197
GitHub stars
12.5K
last updated
Aug 21, 2026

Install

$ npx -y skills add longbridge/gpui-component --skill new-component --agent claude-code

Installs into .claude/skills of the current project.

Files

This is a scaffolding helper for building UI components in GPUI, the Rust-based GPU-accelerated UI framework from Zed Industries. It walks you through the standard patterns: whether to use stateless elements for simple stuff like buttons, stateful elements for data-heavy components like selects, or composition when building on existing pieces. The real value is in the guardrails. It'll push you to follow the existing codebase conventions in crates/ui/src, match Shadcn UI patterns for consistency, and remember the boring stuff like documentation and story registration. If you're contributing to a GPUI project or building internal component libraries, this keeps your components from feeling like they came from a different codebase.

Browse the repository on GitHub

Sponsors

Details

Repository
github.com/longbridge/gpui-component
Categories
Frontend Development, Documentation, Finance & Trading
First seen
Jun 3, 2026

More from longbridge/gpui-component

All 16
1oguzhan18 avatarangular-jestoguzhan18/angular-ecosystem-skillsALWAYS use when testing Angular applications with Jest, configuring Jest, or migrating from Jasmine/Karma to Jest.190skills.sh installs
2oguzhan18 avatarangular-standaloneoguzhan18/angular-ecosystem-skillsALWAYS use when working with Angular Standalone Components, imports array, bootstrapping, or migrating from NgModules in Angular applications.189skills.sh installs
3nexu-io avatarhtml-ppt-weekly-reportnexu-io/open-designTeam weekly / status-update deck — corporate clarity, 8-cell KPI grid, shipped list, 8-week bar chart, next-week table. Use for 周报, business reviews, team statu185skills.sh installs
4nexu-io avatarhtml-ppt-graphify-dark-graphnexu-io/open-design暗底知识图谱 deck —184skills.sh installs
5nexu-io avatarhtml-ppt-xhs-pastel-cardnexu-io/open-design柔和马卡龙慢生活 deck — 奶油184skills.sh installs
6nexu-io avatarhtml-ppt-dir-key-nav-minimalnexu-io/open-design8 页极简方向键 keynote — 每页一个独立单色背景(靛 / 奶 / 绛 / 翠 / 灰 / 紫 / 白 / 炭),各自配色,160px display 标题 + 4px 短粗 accent 线分隔、箭头 → 前缀的 Mono 列表、左下 ← → kbd 提示 + 右下页码、巨大呼吸留白。适合"有话要说但没什么可182skills.sh installs