Log in GO PRO NOW
GO PRO NOW
Want your workflow in The Rundown? Share it

Guides Claude

How To Do a Brand Refresh in Five Minutes With Claude Design

This guide shows you how to use Claude Design to create a refreshed brand design system from an existing website and brand brief.

beginner 4 steps

Introduction

This guide shows you how to use Claude Design to create a refreshed brand design system from an existing website and brand brief. You will produce typography direction, color tokens, reusable web components, website direction, slide templates, and product UI concepts. The source says Claude’s generation can take about five minutes, but you should budget closer to 10–15 minutes if the tool is busy.

Ask for a refresh, not a reinvention. You want the brand to feel better, not unrecognizable.

Step-by-step 4 steps

Instructions

  1. Step 1 of 4

    Create the refreshed brand description

    Screenshot your current site and drop it into your preferred AI tool. Then paste this prompt:

    Prompt 
    Analyze this website and create a refreshed brand description. Keep what works, but sharpen the positioning, visual direction, typography, and color palette. Give me a concise brand summary I can use in Claude Design.

    In the source test, Claude did not want to redesign an existing brand directly, so ChatGPT was used for this part. The key output is a clean refresh brief you can reuse.

    If the response is too long, ask the tool to tighten the brand description before you move on.

  2. Step 2 of 4

    Generate a logo and wordmark

    Take the refreshed brand description and ask your AI tool to generate a logo and a wordmark logo.

    The source example used ChatGPT for its image model, but you can use whichever tool you prefer.

    After generating the logo and wordmark, ask for the full brand refresh in one clean block of text so you can copy and paste it into Claude Design without cleaning it up by hand.

    Download the logo and wordmark files. Even rough first-pass assets can help Claude Design produce a better result.

  3. Step 3 of 4

    Build the design system in Claude Design

    Go to claude.ai/design and click the Design systems tab.

    Create a new design system and follow this setup:

    • Paste the name of your site in the first box.
    • In the last box, paste the refreshed brand description from Step 1.
    • Upload the logo, wordmark, and any other photos or assets you want Claude to use.

    Claude Design may also offer GitHub and Figma inputs. Those are useful if you have them, but you do not need them for a strong first pass.

    Start the generation when everything is in place.

    Claude says this takes about five minutes. In the source test, it often took longer, so budget closer to 10 or 15 minutes if the tool is busy.

  4. Step 4 of 4

    Review the system and export the good parts

    Once the system finishes, do not stop at the first polished screen. Open the foundations and review what Claude made.

    In the source run, Claude generated:

    • Teal as the primary color family
    • Lime as the accent family
    • Graphite neutrals, surfaces, and status colors
    • Spacing rules, corner radii, and elevation
    • Component groups for buttons, status pills, inputs, cards, list rows, and charts

    The neutral system was especially strong, including Rundown Black #111112, Academic Black #0F0F12, Graphite #232326, Graphite Raise #2D2D31, Soft White #F7F5F0, Chalk White #F5F2EA, Muted Stone #A8A29E, and Stone Deep #7A7670.

    The same system also produced a refreshed learning dashboard and could be stretched across other outputs like slide templates and app UI.

You're done

That's the whole workflow

Mark it complete to save your progress. Background and answers to common questions follow below.

Keep going

Keep learning with Rundown Pro

A guide shows you one workflow. Pro opens the full course library, so you can learn the whole system behind it.

  • Every on-demand course
  • Certifications on completion
  • Group office hours and member perks

$29/mo, cancel anytime

Overview Back to the steps

Background and context

Who This Is Useful For

  • Founders and consultants who already have a real brand but need a sharper visual system quickly
  • Marketers and operators who want a better starting point before handing work to a designer or developer
  • Anyone building decks, landing pages, or product mockups who wants one reusable system across everything

What You Will Build

You will build a reusable brand system, not just a prettier homepage. The output is a set of assets and directions you can keep building on.

  • Typography direction and design tokens
  • A cleaner color system with primary, accent, neutral, surface, and status colors
  • Reusable web components like buttons, cards, inputs, and badges
  • A refreshed website direction
  • Slide templates and product UI concepts built from the same system

What You Need

  • A paid Claude plan with access to Claude Design
  • A website you can screenshot
  • Another AI tool for the brand refresh step; the source example used ChatGPT, but you can use whatever you prefer
  • Optional logo files, wordmarks, and brand fonts if you already have them

Going Further

  • After Claude finishes, review the marketing page, web app page, and slide decks it created. Then move the strongest parts into a real project and keep building from the system.
  • Click Share and export the design files to Claude Code
  • Turn the marketing page into a real web project
  • Use the slide templates as the starting point for future decks
  • Turn the system into a PDF brand kit for clients or teammates
$29 billed monthly · cancel anytime
Go Pro