ssimhan/frontend-ui
.claude/skills/sandhya-frontend-designer/SKILL.md
Create aesthetically pleasing, visually distinctive frontend UIs using research-backed prompting strategies from Anthropic's frontend aesthetics cookbook
development
Updated Apr 14, 2026
$ install --global
skillsauthnpx skillsauth add ssimhan/meal-planner frontend-uiInstall 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 14, 2026, 2:33 AM18.6s3 files scanned
SKILL.md
- name:
- frontend-ui
- description:
- Create aesthetically pleasing, visually distinctive frontend UIs using research-backed prompting strategies from Anthropic's frontend aesthetics cookbook
Claude UI/UX Design Skill
Purpose
Automatically enforce high‑quality UI craft and strong UX thinking for any frontend or product‑flow work.
Activation
Apply this skill when:
- Creating or modifying UI (React, HTML, CSS, design systems)
- Designing UX flows, product surfaces, or interaction models
Modes
Claude selects one mode per project unless user specifies:
1. Enterprise Craft Mode
- Grid, spacing, alignment, and hierarchy must be precise
- Consistent radius, elevation, and component density
- Predictable motion; performance‑first
2. Aesthetic Mode
- Strong visual personality
- Theme exploration encouraged
- Creative color, type, and layout choices
Design Direction
Required only for:
- New pages
- New product surfaces Not required for minor edits or bug fixes.
Flow‑First Thinking
Before UI decisions, clarify:
- Purpose of the screen
- Primary user
- Emotional job (what should it feel like to succeed?)
Theme System
Two separate tracks:
- Craft Track → layout, spacing, depth, hierarchy
- Aesthetic Track → typography, palette, motion style
Typography
Claude chooses fonts but must:
- Match tone + audience
- Justify the choice
Motion
- Creative but quick
- Default duration: 120–220ms
- No distracting bounce or heavy physics
- Always respect reduced‑motion
Brand Handling
Ask for color palette if branding is desired. If none is provided, proceed with a neutral system.
Output Standard
Every UI output must show:
- Clear hierarchy
- Visual intention
- Consistent craft
- Purposeful styling
Related Skills
ssimhan/writing-skills
testing
VerifiedTrustedCommunity
Use when creating new skills, editing existing skills, or verifying skills work before deployment
SKILL.mdUpdated Apr 14, 2026
ssimhan/skills/ui-development
development
VerifiedTrustedCommunity
<!-- This skill integrates patterns from: - Original source: https://github.com/Dammyjay93/interface-design - Author: Dammyjay93 - License: MIT - Integrated into claude-code-quickstart SDK by Sandhya Simhan --> --- name: ui-development description: Build premium, crafted interfaces with audience alignment and design system memory. Automatically invoked by workflows for UI/frontend work. --- # UI Development & Premium Aesthetics ## Scope **Use for:** All web interfaces, dashboards,
SKILL.mdUpdated Apr 14, 2026
ssimhan/test-driven-development
development
VerifiedTrustedCommunity
Use when implementing any feature or bugfix, before writing implementation code
SKILL.mdUpdated Apr 14, 2026
ssimhan/image-generator
development
VerifiedTrustedCommunity
Generate branded images using Google Gemini's image generation API. Supports multiple formats (LinkedIn headers, Medium headers, square concepts, vertical explainers). Reads brand guidelines from the project's BRAND.md file for consistent visual identity.
SKILL.mdUpdated Apr 14, 2026