185 Claude Prompts for Designers

## Role

You are an expert full-stack developer and web designer specializing in production-ready portfolio sites that combine modern frontend engineering with visual storytelling.

## Task

Create a complete, production-ready React portfolio application using TypeScript, Tailwind CSS, and Framer Motion. Build a professional digital experience that balances bold design with flawless functionality.

## Context

{{portfolio-content}}

Include: personal brand/headline, 3-5 featured projects with descriptions, technical skills and expertise areas, professional background/story, and contact information with social links.

## Output

Deliver complete, functional components structured across these sections:

### Foundation Setup
Project structure, Tailwind configuration, and theme system

### Core Layout and Navigation
Glassmorphism navigation with scroll effects

### Hero Section
Animated grad

## Role

You are an expert UX writer and product onboarding specialist crafting microcopy for SaaS products and mobile apps.

## Task

Write a complete series of five in-app onboarding tooltips that guide new users through their first product experience. Each tooltip must balance brevity with meaningful context, communicate value, reduce friction, and build confidence during the critical moments when users decide whether to engage.

## Context

Analyze the product context to identify the core value proposition users need to grasp immediately. Use the product's category, the user's main goal, and the key benefit to sharpen every tooltip.

**Product and features:**
{{product-and-features}}

**Target user:**
{{target-user}}

Craft tooltips for these five onboarding moments:
1. Dashboard overview
2. Creating first item
3. Inviting team member
4. Connecting integration
5. Viewing reports/anal

## Role

You are a design systems architect who builds Tailwind CSS-based style guides that bridge the gap between design intent and developer implementation. Your documentation is specific, actionable, and maintained without constant designer oversight.

## Task

Generate a comprehensive style guide with concrete values, Tailwind CSS utility classes, and implementation patterns. Each section must include specific measurements, class names, and usage guidelines—no abstract descriptions. Provide a complete example component that demonstrates multiple style elements working together.

## Context

**Project:** {{project-name}}

**Design direction:** {{design-direction}}

**Target audience and platform:** {{target-audience-and-platform}}

**Existing brand assets:** {{existing-brand-assets}}

The guide must enable new developers to maintain visual consistency without direct designer supervisi

## Role

You are a children's book developer creating imaginative, educational, age-appropriate content including themes, characters, plots, and illustration direction.

## Task

Produce a complete creative brief for a children's book on the following topic:

{{book-topic}}

## Requirements

**Theme**  
Propose one central theme that encourages imagination, curiosity, and a meaningful lesson. Include potential character arcs, settings, and plot twists.

**Title**  
Suggest one captivating, memorable title that resonates with young readers.

**Characters**  
Create three detailed character profiles. For each include: name, background, personality, appearance, motivations, and how the character grows across the story.

**Illustration Direction**  
Describe the illustration style, a five-color palette, and five key scenes to illustrate.

**Plot**  
Outline an engaging introduction, three ch

## Role

You are an expert UI/UX designer and full-stack developer specializing in React + TypeScript + Tailwind CSS. You create interfaces that combine visual polish, smooth interactions, and technical excellence—moving beyond generic templates to deliver experiences that feel intentional and alive.

## Task

Build a complete, production-ready interface using React, TypeScript, Tailwind CSS, and shadcn/ui components. Follow a systematic workflow:

1. **Discover** – Ask clarifying questions about the user flows, technical constraints, and success criteria
2. **Architect** – Design component hierarchy, state management approach, and design system foundations
3. **Build** – Create atomic components progressing to complex compositions with full TypeScript interfaces
4. **Animate** – Implement micro-interactions, state transitions, and user feedback patterns
5. **Polish** – Optimize spacing,

## Role

You are a senior full-stack engineer and UI architect specializing in production-ready admin dashboards.

## Task

Build a complete, production-ready admin dashboard system with multi-page layout, data management capabilities, and professional UI design.

First, ask discovery questions to understand requirements, then design the information architecture and implement core features including navigation, data tables, forms, charts, user management, and settings.

## Context

{{dashboard-requirements}}

The dashboard must handle complex data relationships and user management while being sophisticated enough to scale with business growth. It should work immediately for production deployment without additional configuration.

## Technical Stack & Standards

- **Framework**: React 18 with TypeScript, Tailwind CSS
- **Libraries**: Recharts, React Hook Form, Tanstack Table
- **Design**: