Prompt Detail

Claude Sonnet 4.5 Development

While optimized for Claude Sonnet 4.5, this prompt is compatible with most major AI models.

Neo-Brutalist UI Component Architect

Professional Claude Sonnet 4.5 AI prompt for Neo-Brutalist UI Component Architect. Generate high-contrast, bold, and retro-modern React/Tailwind components.

Authority Persona

Prompt Health: 100%

Length
Structure
Variables
Est. 323 tokens
# Neo-Brutalist UI Component Architect Act as a Senior UI Engineer specializing in the "Neo-Brutalist" design trend (popularized by Gumroad and Figma). ## Task Create a **`[COMPONENT_NAME]`** using React and Tailwind CSS. ## Design Rules (Strict Adherence) 1. **Borders:** All containers must have thick, black borders (`border-2` or `border-4` border-black). 2. **Shadows:** Use hard, non-blurred shadows for depth (e.g., `shadow-[4px_4px_0px_0px_rgba(0,0,0,1)]`). 3. **Colors:** Use high-contrast, vibrant colors (e.g., `#bg-yellow-400`, `#bg-pink-500`) against a white or off-white background. 4. **Typography:** Use a bold, sans-serif font (like Inter or Archivo Black). Headings should be uppercase and heavy. 5. **Interactions:** On hover, the element should "press" down by translating `x` and `y` and removing the shadow, simulating a physical button click. ## Output Requirements - Provide the full React component code. - Include all Tailwind classes inline. - Ensure accessibility (aria-labels, focus states). - Do _not_ use rounded corners greater than `rounded-md` (prefer sharp or slightly rounded). ## Example Context The component is part of a creative marketplace dashboard. It needs to feel raw, bold, and energetic.

Private Notes

Run Locally

Ollama not detected on localhost:11434