bolder
Polishes UI components by increasing layout variance, motion, and typographic impact.
Install
mkdir -p .claude/skills/bolder-educlopez && curl -L -o skill.zip "https://agentskills.codes/api/skills/download/17481" && unzip -o skill.zip -d .claude/skills/bolder-educlopez && rm skill.zipInstalls to .claude/skills/bolder-educlopez
Activation
This is the description your AI agent reads to decide when to run this skill — the better it matches your request, the more reliably it fires.
Amplify personality — raises layout variance and motion, strengthens typography and one signature detail, without slop. Use when the UI works but feels safe, flat, or "template-y", or when the user says "bolder", "more personality", "more creative", or "make it pop" (still professional). Invoke when the user asks for bolder on their UI, or mentions 'bolder' alongside design / UI / frontend work.Key capabilities
- →Update the Craft Read to reflect changes
- →Increase DESIGN_VARIANCE for layout asymmetry
- →Raise MOTION_INTENSITY for purposeful animation
- →Strengthen typography by adjusting weight or size
- →Enhance accent placement within budget
- →Add or strengthen a signature design element
How it works
The skill directly edits code to increase design variance, motion intensity, typography, accent, and a signature detail, while adhering to anti-slop principles.
Inputs & outputs
When to use bolder
- →Make UI bolder
- →Increase creative variance
- →Improve motion design
About this skill
Context: this sub-skill is one lens of the broader ui-craft skill. If the ui-craft skill is also installed, read its SKILL.md first for Discovery + Anti-Slop + Craft Test, then apply the specific lens below.
Make the UI at $ARGUMENTS bolder. Load the ui-craft skill and read references/craft-intent.md.
This is amplitude, not decoration. Increase editorial confidence while staying anti-slop clean.
Apply in order (edit code directly):
- Declare an updated Craft Read — one line: what changed (variance, motion, signature).
- Raise DESIGN_VARIANCE by +1–2 (cap 10). Product surfaces: asymmetric offset, stronger metric hierarchy, or display moment in shell. Marketing: stronger hero composition, section rhythm break, or typographic scale — per
references/craft-intent.mdvariance table. - Raise MOTION_INTENSITY by +1 (cap 10) if below 8 — add one purposeful entrance or hover choreography on the focal element only. Honor
prefers-reduced-motion. - Typography — increase display weight or size one step; tighten tracking on headlines; ensure numbers stay
tabular-nums. - Accent — strengthen focal accent placement (within 3–5 viewport budget); tint primary card or CTA — never add a second accent hue.
- Signature — add or strengthen the one signature bet if missing or weak (see craft-intent §3).
Never add: purple-cyan gradients, bounce easing, glassmorphism stacks, emoji, ALL CAPS headings, three equal icon-card grids, confetti.
Knob gating: if already at variance ≥9 or MOTION ≥9, strengthen signature and typography instead of pushing further.
Output: edit code. Print Review Format table. End with the updated Craft Read line.
Next step: /critique — confirm the added personality did not cost hierarchy or become slop (rung 1).
When not to use it
- →When the UI already has high variance or motion intensity
- →When the goal is to add purple-cyan gradients or bounce easing
- →When the goal is to add glassmorphism stacks or emoji
Limitations
- →Does not add decorative elements like purple-cyan gradients or confetti
- →Caps DESIGN_VARIANCE at 10
- →Caps MOTION_INTENSITY at 10
How it compares
This workflow directly modifies code to amplify personality and editorial confidence, rather than providing conceptual design suggestions.
Compared to similar skills
bolder side by side with the closest alternatives in the catalog.
| Skill | Installs | Updated | Safety | Difficulty |
|---|---|---|---|---|
| bolder (this skill) | 0 | 22d | No flags | Intermediate |
| ui-ux-pro-max | 1,909 | 4mo | Review | Intermediate |
| svg-precision | 527 | 3mo | Review | Intermediate |
| mobile-android-design | 101 | 2mo | No flags | Intermediate |
Try saying
Example prompts that trigger this skill in your AI assistant.
More by educlopez
View all by educlopez →You might also like
ui-ux-pro-max
nextlevelbuilder
UI/UX design intelligence. 50 styles, 21 palettes, 50 font pairings, 20 charts, 8 stacks (React, Next.js, Vue, Svelte, SwiftUI, React Native, Flutter, Tailwind). Actions: plan, build, create, design, implement, review, fix, improve, optimize, enhance, refactor, check UI/UX code. Projects: website, landing page, dashboard, admin panel, e-commerce, SaaS, portfolio, blog, mobile app, .html, .tsx, .vue, .svelte. Elements: button, modal, navbar, sidebar, card, table, form, chart. Styles: glassmorphism, claymorphism, minimalism, brutalism, neumorphism, bento grid, dark mode, responsive, skeuomorphism, flat design. Topics: color palette, accessibility, animation, layout, typography, font pairing, spacing, hover, shadow, gradient.
svg-precision
dkyazzentwatwa
Deterministic SVG generation, validation, and rendering. Use for icons, diagrams, charts, UI mockups, or technical drawings requiring structural correctness and cross-viewer compatibility.
mobile-android-design
wshobson
Master Material Design 3 and Jetpack Compose patterns for building native Android apps. Use when designing Android interfaces, implementing Compose UI, or following Google's Material Design guidelines.
frontend-slides
sickn33
Create stunning, animation-rich HTML presentations from scratch or by converting PowerPoint files. Use when the user wants to build a presentation, convert a PPT/PPTX to web, or create slides for a talk/pitch. Helps non-designers discover their aesthetic through visual exploration rather than abstract choices.
scroll-experience
davila7
Expert in building immersive scroll-driven experiences - parallax storytelling, scroll animations, interactive narratives, and cinematic web experiences. Like NY Times interactives, Apple product pages, and award-winning web experiences. Makes websites feel like experiences, not just pages. Use when: scroll animation, parallax, scroll storytelling, interactive story, cinematic website.
penpot-uiux-design
github
Comprehensive guide for creating professional UI/UX designs in Penpot using MCP tools. Use this skill when: (1) Creating new UI/UX designs for web, mobile, or desktop applications, (2) Building design systems with components and tokens, (3) Designing dashboards, forms, navigation, or landing pages, (4) Applying accessibility standards and best practices, (5) Following platform guidelines (iOS, Android, Material Design), (6) Reviewing or improving existing Penpot designs for usability. Triggers: "design a UI", "create interface", "build layout", "design dashboard", "create form", "design landing page", "make it accessible", "design system", "component library".