skills.rest
f4rkh4d
f4rkh4dCOMMUNITY
Explore all skills by this author →
WebsiteGitHub

forge-soft

Apply premium-soft UI styling with warm neutrals, refined typography, and unified shadows.

Updated Aug 27, 2026
Search Tags:#typography#design system#color palette#ui design#component styling#premium aesthetics#motion easing
One-click install
npx skills add https://github.com/f4rkh4d/forge-skill --skill forge-soft
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: forge-soft
Source: https://github.com/f4rkh4d/forge-skill/tree/main/skills/design/forge-soft
Command: npx skills add https://github.com/f4rkh4d/forge-skill --skill forge-soft

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes assets (resource) components.

What problem does it solve?

This Skill prevents AI-generated UI from looking washed-out or default by enforcing a premium-soft design register with warm neutrals, refined typography, consistent shadows, restraint in gradients, and considered motion.

Core Features & Use Cases

  • Warm, premium palettes: Applies warm-leaning neutrals (no pure white/black), low-contrast borders, and a single sparing brand accent for “expensive” tone.
  • Refined type system: Enforces a display/body (or optional editorial) font stack, tight headline tracking, limited font weights, and legible body sizing with consistent hierarchy.
  • Coherent polish rules: Standardizes shadow recipes, radii ranges, spacing for landing sections, and spring/cubic-bezier motion so cards, buttons, and sections feel consistently high-end.
  • Use case: When drafting an app landing page or product dashboard mock, use this Skill to produce calm, premium UI sections like hero + cards + CTA buttons without the typical AI fingerprints (indigo gradients, uniform heavy shadows, default radii, or crude transition-all).

Quick Start

Ask the agent to redesign the UI of your landing page using the forge-soft register, following its palette, typography, shadow, radius, spacing, and motion rules.

Frequently Asked Questions about forge-soft

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I make AI-generated landing pages look premium instead of generic?▼

Premium UI design applies warm neutral palettes with a single brand accent, tight display typography, and standardized shadow recipes to prevent generic SaaS aesthetics and washed-out interfaces.

Why does my generated UI design system look washed out with default colors?▼

UI design systems look washed out when using pure white or black backgrounds with indigo-violet gradients. Applying a warm neutral palette with low-contrast borders and a single sparing accent creates an expensive, premium-soft tone.

What's the best way to style cards and CTA buttons for a premium SaaS dashboard mock?▼

The best way to style cards and CTA buttons is to apply a unified shadow recipe with consistent radii ranges and spring-like motion easing to ensure buttons and sections feel high-end.

How do I set up typography and spacing scales for refined UI component styling?▼

To set up refined UI typography and spacing, enforce a display and body font stack with limited weights, tight headline tracking, and guarded spacing scales for consistent hierarchy across landing sections.

Can I use spring motion easing and cubic-bezier transitions for UI components?▼

Yes, you can use spring motion easing and cubic-bezier transitions for UI components to replace crude transition-all effects, ensuring cards, buttons, and sections feel consistently high-end.

When should I not use indigo-violet gradients in UI design?▼

You should not use indigo-violet gradients in UI design when aiming for a premium-soft aesthetic, as strict visual constraints require warm neutrals and restraint in gradients to avoid typical AI fingerprints.

Related Skills

Explore More Design & Creative Skills→
timequitytimequity
6

ui-generator

Generate React/Next.js UI components with Tailwind CSS from natural language descriptions.

Official
Intermediate
toddmoytoddmoy
1

modernist

Generate Swiss Design and Bauhaus UI layouts with CSS/TSX design tokens.

Community
Advanced
lexicalninjalexicalninja
2

color-system-designer

Design accessible color palettes with design tokens and contrast metrics.

Community
Advanced
BenAIOSBenAIOS

minimalist-ui

Generate ultra-minimalist web interfaces with warm monochrome palettes and bento-grid layouts.

Official
Advanced