building-layout-primitives

Community

Build consistent, scalable web layouts.

Authoralexejluft
Version1.0.0
Installs0

System Documentation

What problem does it solve?

This Skill addresses the common issue of inconsistent spacing, padding, and structure in web project layouts, leading to a fractured and unprofessional appearance.

Core Features & Use Cases

  • Enforces Layout Standards: Utilizes Container, Section, Stack, and Grid primitives to ensure uniform spacing and structure across the entire project.
  • Improves Developer Efficiency: Provides pre-defined, reusable layout components, reducing the need to reinvent spacing patterns.
  • Use Case: When building a new feature section on a webpage, use the Section and Container primitives to ensure it aligns with the project's established padding and max-width rules, and use Grid to arrange feature cards consistently.

Quick Start

Use the building-layout-primitives skill to create a new section for features with a heading and three feature cards arranged in a responsive grid.

Dependency Matrix

Required Modules

None required

Components

references

💻 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: building-layout-primitives
Download link: https://github.com/alexejluft/brudi/archive/main.zip#building-layout-primitives

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.