Към всички skills

design-taste-frontend-v1

Leonxlnx · Дизайн

The original v1 taste-skill, preserved for projects depending on its exact behavior. The current default is `design-taste-frontend` (v2 experimental), which is a substantial rewrite. Use this v1 install name only if you need exact backward compatibility.

Оригинален текст · няма потвърден превод на български

Теми: agent · ai · claude · claude-code · codex · coding · design · frontend · lowcode · nocode · skill · skills · vibecoding

Първо прочетете инструкцията.

Файлът се зарежда от посочения източник само по ваше действие. Можете да го прочетете тук, да го копирате или да го запазите като .md.

Оригинален SKILL.md
GitHub хранилище
Звезди на репото
89 523
Лиценз
MIT
Последна проверка на записа
19.09.2026 г.

Добавете в своя инструмент.

Командата отваря избора на skills от репозитория. Прочетете файла и условията на автора преди изпълнение.

npx skills add Leonxlnx/taste-skill

Страницата копира текст. Не инсталира и не изпълнява нищо на устройството ви.

Откъс от SKILL.md

Началото на файла на автора, без превод.

High-Agency Frontend Skill

1. ACTIVE BASELINE CONFIGURATION

  • DESIGN_VARIANCE: 8 (1=Perfect Symmetry, 10=Artsy Chaos)
  • MOTION_INTENSITY: 6 (1=Static/No movement, 10=Cinematic/Magic Physics)
  • VISUAL_DENSITY: 4 (1=Art Gallery/Airy, 10=Pilot Cockpit/Packed Data)

AI Instruction: The standard baseline for all generations is strictly set to these values (8, 6, 4). Do not ask the user to edit this file. Otherwise, ALWAYS listen to the user: adapt these values dynamically based on what they explicitly request in their chat prompts. Use these baseline (or user-overridden) values as your global variables to drive the specific logic in Sections 3 through 7.

2. DEFAULT ARCHITECTURE & CONVENTIONS

Unless the user explicitly specifies a different stack, adhere to these structural constraints to maintain consistency:

  • DEPENDENCY VERIFICATION [MANDATORY]: Before importing ANY 3rd party library (e.g. framer-motion, lucide-react, zustand), you MUST check package.json. If the package is missing, you MUST output the installation command (e.g. npm install package-name) before providing the code. Never assume a library exists.
  • Framework & Interactivity: React or Next.js. Default to Server Components (RSC).
    • RSC SAFETY: Global state works ONLY in Client Components. In Next.js, wrap providers in a "use client" component.
    • INTERACTIVITY ISOLATION: If Sections 4 or 7 (Motion/Liquid Glass) are active, the specific interactive UI component MUST be extracted as an isolated leaf component with 'use client' at the very top. Server Components must exclusively render static layouts.
  • State Management: Use local useState/useReducer for isolated UI. Use global state strictly for deep prop-drilling avoidance.
  • Styling Policy: Use Tailwind CSS (v3/v4) for 90% of styling.
    • TAILWIND VERSION LOCK: Check package.json first. Do not use v4 syntax in v3 projects.
    • T4 CONFIG GUARD: For v4, do NOT use tailwindcss plugin in postcss.config.js. Use @tailwindcss/postcss or the Vite plugin.
  • ANTI-EMOJI POLICY [CRITICAL]: NEVER use emojis in code, markup, text content, or alt text. Replace symbols with high-quality icons (Radix, Phosphor) or clean SVG primitives. Emojis are BANNED.
  • Responsiveness & Spacing:
    • Standardize breakpoints (sm, md, lg, xl).
    • Contain page layouts using max-w-[1400px] mx-auto or max-w-7xl.
    • Viewport Stability [CRITICAL]: NEVER use h-screen

Целият SKILL.md в GitHub