Skills
.Work. You
Rest

gpui-layout

Community

Style GPUI elements with ease.

Design & Creative#layout#styling#tailwind#gpui#flexbox#grid
Authoronehr
Version1.0.0
Installs0

System Documentation

What problem does it solve?

This Skill simplifies the process of defining the visual appearance and spatial arrangement of UI elements within the GPUI framework, making it easier to build complex and aesthetically pleasing interfaces.

Core Features & Use Cases

  • Declarative Styling: Apply styles using a Tailwind-like API with methods like .bg(), .flex(), .p(), and .rounded().
  • Layout Management: Utilize flexbox and grid properties for precise control over element positioning and distribution.
  • Use Case: When you need to create a centered card with a specific background color, padding, and rounded corners, this skill provides the direct methods to achieve it.

Quick Start

Use the gpui-layout skill to create a div with a blue background, padding of 4 units, 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
Download link: https://github.com/onehr/gpui-skills/archive/main.zip#gpui-layout

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.