Skills
.Work. You
Rest

gpui-layout-and-style

Official

Style GPUI components with CSS-like layouts.

Design & Creative#theming#layout#style#rust#gpui#flexbox#css-like
Authorlongbridge
Version1.0.0
Installs0

System Documentation

What problem does it solve?

Styling GPUI components can be verbose and inconsistent; this skill introduces a CSS-like styling layer with Rust type-safe APIs to unify appearance and layout across an app.

Core Features & Use Cases

  • Flexbox-based layout helpers for horizontal and vertical arrangements.
  • Styled trait for method chaining to compose visual styles (colors, borders, shadows, size).
  • Size and spacing primitives (px, rems, relative units) for precise, scalable UI.
  • Theme integration and conditional styling to adapt to runtime themes and states.
  • Real-world use cases include building responsive cards, dashboards, and editor-like panels with consistent visuals.

Quick Start

Create a styled GPUI div using the styling primitives to render a card with background color, padding, and rounded corners.

Dependency Matrix

Required Modules

None required

Components

Standard package

💻 Claude Code Installation

Recommended: Let Claude install automatically. Simply copy and paste the text below to Claude Code.

Please help me install this Skill:
Name: gpui-layout-and-style
Download link: https://github.com/longbridge/gpui-component/archive/main.zip#gpui-layout-and-style

Please download this .zip file, extract it, and install it in the .claude/skills/ directory.
View Source Repository

Agent Skills Search Helper

Install a tiny helper to your Agent, search and equip skill from 223,000+ vetted skills library on demand.