sf-lwc-page-composition

Installation
SKILL.md

sf-lwc-page-composition: App Builder-Aware LWC Design

Build Lightning Web Components that are excellent citizens on Lightning pages. Components must look great standalone and alongside other components in App Builder's column layouts.

Core Principles

  1. Fluid, not fixed — components fill their column, never overflow
  2. Configurable — expose meaningful properties in App Builder
  3. Consistent height — cards in the same row should align visually
  4. Communicate cleanly — use LMS for cross-DOM, events for parent-child
  5. Design-time friendly — show useful previews in App Builder

App Builder Column Layouts

Lightning pages use a region-based grid. Components must adapt to these widths.

| Layout | Regions | Approximate Widths |

Related skills
Installs
7
GitHub Stars
14
First Seen
Mar 6, 2026