47network/layout-spacing
skills/design/layout-spacing/SKILL.md
Generate spacing scales, CSS grid systems, responsive breakpoints, z-index layers, and ready-to-use layout patterns (dashboard, sidebar, card grid, holy grail, etc).
$ install --global
skillsauthnpx skillsauth add 47network/Sven layout-spacingInstall this skill globally with one command. Works with Claude Code, Cursor, and Windsurf.
Security Scan Results
3 of 9 scanners reported clean
Some scanners were skipped, did not run, or reported a non-clean status. Review each row below.
3
Scanners Passed
9
Scanners in report
Clean
TrivyContainer and dependency vulnerability scanner
95%
Clean
SemgrepStatic code analysis for vulnerabilities
95%
Clean
mcp-scan (Snyk)Model Context Protocol security validation
95%
Skipped
Snyk (dep)Open source security scanning
50%
Skipped
Socket.devSupply chain security analysis
50%
Skipped
VirusTotalMulti-engine malware detection
50%
Skipped
CrowdStrikeAdvanced threat intelligence
50%
Skipped
OSV-ScannerOpen Source Vulnerability database check
50%
Skipped
OWASP Dep-Check
50%
Last scanned: Apr 23, 2026, 5:57 PM77.3s2 files scanned
SKILL.md
- name:
- layout-spacing
- description:
- Generate spacing scales, CSS grid systems, responsive breakpoints, z-index layers, and ready-to-use layout patterns (dashboard, sidebar, card grid, holy grail, etc).
- version:
- 2026.4.11
- publisher:
- 47Network
- handler_language:
- typescript
- handler_file:
- handler.ts
- inputs_schema:
- {"type":"object","properties":{"action":{"type":"string","enum":["spacing","grid","auto_grid","breakpoints","z_index","pattern","all_patterns"],"default":"spacing"},"base_px":{"type":"number","default":4},"scale_method":{"type":"string","enum":["linear","geometric","modular"],"default":"linear"},"columns":{"type":"integer","minimum":1,"maximum":24,"default":12},"gap_px":{"type":"number","default":16},"max_width_px":{"type":"number","default":1280},"min_item_width_px":{"type":"number","default":280},"strategy":{"type":"string","enum":["mobile-first","desktop-first"],"default":"mobile-first"},"pattern_name":{"type":"string","description":"Layout pattern: holy-grail, sidebar-content, card-grid, dashboard, split-screen, centered-content"}},"required":["action"],"additionalProperties":false}
- outputs_schema:
- {"type":"object","properties":{"action":{"type":"string"},"result":{"type":"object"}},"required":["action","result"]}
Layout & Spacing Skill
Generate spacing systems, CSS grid layouts, responsive breakpoints, z-index layers, and production-ready layout patterns.
Actions
spacing— Generate a spacing scale from base unit and methodgrid— Generate a CSS Grid system with responsive breakpointsauto_grid— Generate an auto-fit responsive card gridbreakpoints— Generate responsive breakpoint media queriesz_index— Get the z-index layer systempattern— Get a specific layout patternall_patterns— List all available layout patterns
Examples
- "Generate a 4px spacing scale" →
{ action: "spacing", base_px: 4 } - "Create a 12-column grid" →
{ action: "grid", columns: 12 } - "Give me a dashboard layout" →
{ action: "pattern", pattern_name: "dashboard" }
Scope Mapping
design.layout: read (generates CSS code, no side effects)
Related Skills
47network/webapp-tester
development
VerifiedTrustedCommunity
Automated web testing advisor — generate Playwright test scripts, accessibility checks, and performance audits.
3SKILL.mdUpdated Apr 23, 2026
47network/security-posture
testing
VerifiedTrustedCommunity
Unified security posture reporting — combines SAST, dependency audit, secret scan, infrastructure scan, and pentest results into a single scored report with OWASP and SOC 2 compliance mapping, top risks, and remediation recommendations.
3SKILL.mdUpdated Apr 23, 2026
47network/secret-scanner
development
VerifiedTrustedCommunity
Detect hardcoded secrets, API keys, tokens, private keys, and credentials in source code and config files. 20 built-in patterns covering AWS, GitHub, Slack, Stripe, database URLs, JWTs, and more.
3SKILL.mdUpdated Apr 23, 2026
47network/sast-scanner
development
VerifiedTrustedCommunity
Static Application Security Testing — scan TypeScript/JavaScript source code for SQL injection, XSS, SSRF, path traversal, command injection, hardcoded secrets, insecure crypto, auth bypass, prototype pollution, and more. 14 built-in rules mapped to OWASP Top 10 and CWE.
3SKILL.mdUpdated Apr 23, 2026