Skip to main content

CodeRabbit

I joined CodeRabbit pre-seed as a founding product engineer and built the public foundations of the company end to end: the design system, the marketing site, the blog, and self-serve docs the whole team could publish to.

Visit CodeRabbit
  • Founding Product Engineer
  • Design System
  • Marketing Site & Blog
  • Docs Infrastructure
  • Motion & Illustration
The CodeRabbit marketing site as it stands today, several redesigns after my time on the project.

Where it started

CodeRabbit is an AI code reviewer: it reads a pull request and leaves contextual, line-by-line feedback before a human opens the diff. I joined at pre-seed, when the product worked but almost nothing around it did. A developer landing on the site had no fast way to grasp what the tool actually did, and anyone outside engineering needed a ticket to publish a page.

The custom icon set built for CodeRabbit: twenty-one geometric marks covering security, collaboration, code, infrastructure and analytics.

A design system, not a pile of pages

Rather than designing screens one at a time, I built the system underneath them: type scale, color, spacing, and a component library the marketing site, the blog and the docs all draw from. A custom icon set came with it, so surfaces built months apart still read as one company.

Explaining the product without a deep-dive

A screenshot of a pull request thread means little to someone who has not sat through a slow review, and the audience was never only senior engineers. So the site explains the review flow visually rather than in prose: annotated diffs, worked examples, and illustration doing the job a paragraph could not.

Feature sections of the CodeRabbit site walking through a review: an annotated diff, a suggested fix, and a custom line illustration.
The CodeRabbit documentation site in dark mode, with a sidebar of guides and integrations and a diagram of the review flow.
The CodeRabbit blog index, showing post cards with custom illustrations.

Docs and a blog the whole team could publish to

The blog and the documentation run on the same system, with a self-serve authoring path behind them. Publishing stopped being an engineering ticket: anyone could ship a page and it came out looking like the rest of the site. Content was the main channel, and engineering time the scarcest thing in the building.

The CodeRabbit color system: neutral, cream, orange, pink, aquamarine and yellow, each with hex, RGB and CMYK values and a defined role.
The CodeRabbit typography page, documenting Scandia in bold, medium and regular weights.

Written down, so it outlived me

The point of a system is that it keeps working once you leave. Color, type and the graphic language all ended up documented rather than living in one person's head, which is what let the brand hold together across a marketing site, a blog, docs and a product dashboard.