skills.rest
deepparser
deepparserOFFICIAL
Explore all skills by this author →
WebsiteGitHub

design-minimax

Apply MiniMax's design system tokens and component styles when generating UI.

Updated Feb 23, 2026
Search Tags:#typography#design system#css#design tokens#ui design#minimax#brand styling
One-click install
npx skills add https://github.com/deepparser/skills --skill design-minimax-deepparser
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: design-minimax
Source: https://github.com/deepparser/skills/tree/main/design-minimax
Command: npx skills add https://github.com/deepparser/skills --skill design-minimax-deepparser

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve? Building interfaces that match MiniMax's visual identity requires exact design tokens—colors, typography, spacing, shadows, and component styles—which are tedious to reverse-engineer manually from the brand's website. ## Core Features & Use Cases - Complete Design Token Reference: Provides exact hex colors (brand blue #1456f0, brand pink #ea5ec1), a multi-font typography system (DM Sans, Outfit, Poppins, Roboto), spacing scale, border-radius scale, and purple-tinted shadow values. - Component Specifications: Defines pill buttons (9999px radius), product cards with 20-24px radius and gradient backgrounds, navigation patterns, and elevation levels with concrete CSS values. - Light and Dark Previews: Bundled preview.html and preview-dark.html files demonstrate the full design system implemented in both themes for visual verification. - Use Case: When asked to build a landing page styled like MiniMax, the skill supplies the exact hero typography (80px Outfit, weight 500, line-height 1.10), white-dominant layout rules, and card styling so the output matches the brand. ## Quick Start Use the design-minimax skill to create a product showcase landing page styled like MiniMax's website.

Frequently Asked Questions about design-minimax

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

FAQPage Schema
How do I build a UI that looks like MiniMax's website?▼

Use white as the dominant background, DM Sans for body text, Outfit for display headings at weight 500, pill-shaped buttons with 9999px radius for navigation, and product cards with 20-24px radius and vibrant gradients. The skill provides all exact token values.

What fonts and colors does the MiniMax design system use?▼

It uses four fonts: DM Sans for UI, Outfit for display headings, Poppins for mid-tier headings, and Roboto for data. Key colors are brand blue #1456f0, primary blue #3b82f6, brand pink #ea5ec1, and near-black text #222222 on white backgrounds.

Does this design system support dark mode?▼

Yes, the skill bundles a preview-dark.html file implementing the full design system with dark tokens, including a #181e25 page background, adjusted text colors, and stronger shadow opacities for dark surfaces.

What are the limitations of the MiniMax design style?▼

The style forbids colored backgrounds on main content sections, sharp corners on product cards, brand pink on text or buttons, and heading weights above 600. It suits product-showcase marketing pages rather than dense data dashboards.

How do I verify my generated UI matches the design system?▼

Open the bundled preview.html or preview-dark.html files to compare your output against the reference implementation of colors, typography scale, buttons, cards, forms, spacing, and elevation levels.

Related Skills

Explore More Design & Creative Skills→
pikkujspikkujs

copywriting

Generate conversion-focused marketing copy for web pages.

Official
Intermediate
aifredoaiaifredoai

frontend-design

Generate production-grade frontend interfaces with unique aesthetics and user experience.

Official
Advanced
shirulotshirulot

Color Palette Generator

Generate WCAG-compliant color palettes with contrast ratio calculations.

Community
Intermediate
TechCorp25TechCorp25

design-system-patterns

Build design systems with design tokens, theming infrastructure, and component architecture patterns.

Community
Advanced