bitjaru/styleseed127 installs

ss-pattern

Q: How do I install this agent skill?

Run npx skills add https://github.com/bitjaru/styleseed --skill ss-pattern.

Q: Is this agent skill safe to install?

Review the displayed partner audits, complete source, permissions, dependencies, and exact revision before installing.

Generate a composed UI pattern (card layout, list, form section, grid, etc.) using design system primitives

How do I install this agent skill?

npx skills add https://github.com/bitjaru/styleseed --skill ss-pattern

view source ↗

Is this agent skill safe to install?

Gen Agent Trust Hubpass
The skill is a standard utility for generating UI pattern components such as cards, grids, and forms using a local design system's primitives. It follows project-specific conventions and utilizes standard file management tools for code generation without any detected malicious patterns.
Socketpass
No alerts
Snykpass
Risk: LOW · No issues

What does this agent skill do?

UI Pattern Generator

When NOT to use

For a single primitive component → use /ss-component
For a full mobile screen → use /ss-page
For an entire multi-page user flow → use /ss-flow
For design tokens and color/spacing decisions → use /ss-tokens

Pattern type: $0 Description: $ARGUMENTS

Available Pattern Types

Layout Patterns

card-section: Card with title + content inside page section (mx-6)
grid-2col: 2-column grid of cards (grid grid-cols-2 gap-4 px-6)
scroll-horizontal: Horizontal scrolling card list (flex gap-3 overflow-x-auto scrollbar-hide)
list-section: Vertical list of items inside a card
form-section: Form with labeled inputs in a card
stat-grid: Grid of StatCard components

Data Display Patterns

data-table: Table with header and rows
detail-card: Key-value pair display
chart-card: Card wrapper for a Recharts chart
ranking-list: Numbered ranking with highlight

Interactive Patterns

action-sheet: Bottom sheet with action buttons
filter-bar: Horizontal filter/tab bar
search-header: Search input in header area

Instructions

Read the design system reference:
- CLAUDE.md for conventions
- components/ui/ for available primitives
- components/patterns/ for existing patterns
Compose the pattern from existing components — DO NOT recreate primitives.
Follow the design system layout rules:
- Cards: bg-card rounded-2xl p-6 shadow-[var(--shadow-card)]
- Section wrapper: mx-6 for horizontal margin
- Section title: text-foreground font-bold text-[18px] mb-4
- List gap: space-y-3
- Grid gap: gap-4
Use semantic tokens for all visual properties.
Make the pattern a reusable component with props for dynamic content.

How can the creator link this skill?

Add the canonical catalog link to the repository README so users can inspect current installs and available audits. The publishing guide covers the complete discovery path.

<a href="https://skillzs.dev/skills/bitjaru/styleseed/ss-pattern">View ss-pattern on skillZs</a>