Rebranding 7 Products in One Sprint: The Helsky Labs Brand Overhaul

The Problem: Seven Products, Zero Cohesion

Helsky Labs had a branding problem. Each product had been designed in isolation - whatever looked good at the time, whatever color felt right that afternoon. DropVox had purple soundwaves. TokenCentric had generic teal circles. Days as Numbers had a grid that looked like pixel art. Bookbit had clipart energy.

Nothing felt like it belonged to the same family.

If you squinted at the app icons side by side, the only thing they had in common was that they were all squares. That's not a brand system. That's a coincidence.

What Needed to Change

The goal was clear: make every Helsky Labs product feel like a sibling without making them look identical. Siblings share DNA but have their own personality.

Here's what "cohesion" means in practice:

• Same type system across every product (Geist for display, Inter for body, JetBrains Mono for code)
• Same icon language - rounded forms, centered composition, flat-with-depth
• Same marketing structure - dark backgrounds, clear hierarchy, consistent OG images
• Different color palettes - each product owns its own hue range, no overlaps

The last point matters. Color is the fastest identifier. You should know which product you're looking at from the accent color alone.

The Color Territory Map

Before touching a single pixel, I mapped out color ownership:

No collisions. Every product is instantly distinguishable by color alone.

The Toolchain

This rebrand was done almost entirely with three tools:

1. Recraft AI - Vector logo generation via API. Generates native SVGs, not rasters. This is the key differentiator from tools like Midjourney or DALL-E - you get production-ready vectors.

2. Figma - Design system assembly, color variant generation, review pages, and final exports.

3. Claude Code - Orchestrating the entire pipeline. API calls, SVG manipulation, color variant generation, file organization, review page generation.

No Illustrator. No Photoshop. No designer on retainer.

The Recraft Workflow

For each product, the process was:

1. Write the prompt

Each product got a carefully written prompt that described the visual metaphor, not just "make me a logo." For example, Gitography's prompt focused on constellation patterns and connected nodes - explicitly avoiding the obvious git-branch diagram that every other git tool uses.

2. Generate 6 icon variations

curl -s https://external.api.recraft.ai/v1/images/generations \
  -H "Authorization: Bearer $API_KEY" \
  -d '{
    "prompt": "...",
    "model": "recraftv4_vector",
    "size": "1024x1024",
    "n": 6,
    "controls": {
      "colors": [{"rgb": [8, 145, 178]}],
      "background_color": {"rgb": [255, 255, 255]}
    }
  }'

Six vectors per product. The controls.colors parameter is critical - it constrains the output to your brand palette instead of letting the AI pick random colors.

3. Generate 6 wordmark variations

Same API call but with a text-focused prompt. The wordmark is just the product name in a typeface that matches the icon's personality.

4. Pick favorites and generate color variants

After reviewing all 12 SVGs per product (6 icons + 6 wordmarks), pick the best of each and generate 6 color variants:

• Color on white
• Color on transparent
• Black on white
• Black on transparent
• White on dark background
• White on transparent

That's 18 SVG files per product (3 types x 6 variants). Across 7 products, that's 126 production-ready brand assets.

5. Build the lockup

Compose icon + wordmark into a stacked lockup SVG. This is the "official" logo used on marketing sites and social media.

The Monochrome Pivot

Partway through the rebrand, I made a decision that simplified everything: the parent brand (Helsky Labs itself) went monochrome. No more aurora gradients, no more coral accents. Just black and white.

This was inspired by switching the typography to Space Grotesk + Space Mono - a combination that just feels right in monochrome. The HR monogram mark replaced the old text logo.

The commit trail tells the story:

feat: update color tokens to monochrome palette
feat: swap typography to Space Grotesk + Space Mono
feat: update Hero and ParticleField to monochrome
feat: update all section components to monochrome
feat: swap logo to HR mark SVG, update Nav + Footer
feat: update blog components to monochrome
feat: update generated assets to monochrome
chore: remove rose palette completely

Each product keeps its own color identity. But the umbrella brand - the studio itself - is pure monochrome. This creates a clean frame that lets each product's color pop.

The Asset Pipeline

Logos are just the beginning. Each product needs dozens of platform-specific assets: favicons at 6 sizes, Apple touch icons, Android adaptive icons, OG images, social media cards, email headers, app store screenshots.

We built a pipeline that handles this automatically:

# Generate every asset from a single source SVG
./tools/generate-assets.sh gitography logo.svg web-app

# Sync to the actual project repo
./tools/sync-to-projects.sh gitography

One source file in, dozens of platform-perfect assets out. The pipeline handles resizing, format conversion (SVG to PNG to ICO to ICNS), safe zone cropping for Android, and platform-specific quirks.

What I Learned

1. Color territory planning is the most important step

Skip this and you'll end up with two products fighting over teal. Map it out first, enforce it always.

2. Recraft's vector output changes the game

Getting native SVGs from an AI tool means you can manipulate colors programmatically. No need to re-generate when you want a dark mode variant - just sed the fill colors.

3. Consistency beats individual brilliance

A mediocre logo that fits the family is better than a stunning logo that looks like it belongs to a different company. The family coherence matters more than any single mark.

4. Automate the boring parts

The difference between "we have a logo" and "we have a complete brand presence" is about 40 platform-specific asset files per product. Nobody should create those by hand.

5. The parent brand should be the quietest

By going monochrome for Helsky Labs itself, each product gets to be the star. The studio brand is the stage, not the performer.

The Numbers

• 7 products rebranded
• 126 SVG assets generated (18 per product)
• 280+ platform-specific assets produced by the pipeline
• ~80 Recraft credits per product (~560 total)
• 1 sprint from start to deployed

Every product now shares typography, icon language, and marketing structure while maintaining its own distinct color identity. For the first time, Helsky Labs actually looks like a product family.

The whole thing was designed, generated, reviewed, variant-produced, and deployed without opening a single traditional design application for the logo work itself. Recraft API + Claude Code + a well-structured pipeline did the heavy lifting. Figma handled the design system assembly and review.

This is what building in public looks like in 2026: AI generates, you curate, automation distributes.