Solara: A marketing site and visual identity that earn enterprise trust.

A visual identity and homepage that turn GitHub curiosity into signed-up users.

Open a dozen developer-tool websites and you'll see the same palette twelve times: cold blues, neutral grays, dark-mode gradients. Solara's own name offered a way out — "Solar-a" carries an inherent association with sunlight and warmth. This project turned that association into a visual identity, and the identity into a marketing homepage built to convert the framework's GitHub-driven curiosity into users.

I designed the identity and the homepage — and just as deliberately, engineered how they'd ship. Every motion concept on the page was designed inside a constraint I set with the engineers up front: it had to be implementable in pure CSS. That constraint shaped the design system, the handoff, and ultimately how fast a two-engineer team could build it.

By Q4 2024, Solara had 3k+ new users — several of them enterprise — laying the path for a seed round of funding.

This case study covers the brand identity and marketing homepage. The documentation portal that carries the identity into Solara's product surface is a separate story — see the Solara documentation case study.

Discovery happened on GitHub. Conversion died on the landing page.

Solara didn't have a traffic problem — it had a trust problem. The overwhelming majority of visitors arrived from the GitHub repository, already curious, already technical, already halfway to trying the framework.

Then they hit the landing page: a pastel spatial theme with cartoon rockets and toy planets. Charming for a side project; disqualifying for a framework asking enterprises to build production apps on it. Conversion stayed low, and the visual register undercut the engineering quality it was supposed to represent.

With the team, I framed three goals for the redesign:

• Clearly communicate the value proposition — what Solara is, who it's for, in one screen.
• Establish a distinguished visual identity — one that could stretch across the site, docs, and product.
• Revamp the information architecture — strip the page down to a single conversion goal.

The name already contained the brand: sunrise.

From association to concept

Rather than inventing an identity from nothing, I pulled on the one thread the product already owned. "Solara" evokes the sun — and in a market washed in cold blues, warmth itself is differentiation.

The reference that unlocked the direction was an image of an astronaut drifting above a planet at dawn: vast, calm, and quietly technical. I translated it into a hyper-realistic sunrise horizon for the hero — the same spatial wonder the old site reached for with toy rockets, now rendered with the restraint enterprises read as maturity.

From toy-like to enterprise-grade

Applied to the homepage hero, the sunrise replaced the pastel gadgets wholesale: dark surface, warm horizon glow, typography given room to breathe. Same spatial story, opposite trust signal.

The direction arrived in versions

The sunrise wasn't the first hero — it was the third. The earliest layouts wore the same generic dark-SaaS uniform the redesign was supposed to escape; the Solara brand landed on the page before the warmth did. Only the final pass committed to the sunrise horizon that makes the identity legible at a glance — and it's that pass, sunrise and all, that shipped.

One language across every surface

The identity had to work harder than one hero image. Logo treatment, palette, code-snippet styling, integration badges, event banners — every marketing surface draws from the same warm-on-dark language, so a visitor moving from the repo to the site to the docs never feels a seam.

A motion language designed to run on pure CSS.

The constraint that shaped the system

Solara's team was two engineers with a framework to maintain — a marketing site couldn't cost them a JavaScript animation runtime. So I set the constraint before designing a single hover state: every motion concept must be expressible with CSS opacity and color transitions alone.

The card component shows what that constraint produced. Its backdrop is a miniature of the hero: the Solara emblem glow (bgAurora) sits as a background fill beneath a dark foreground layer. On hover, the foreground's opacity drops and the emblem eases through — a sunrise, replayed at component scale, with zero JavaScript.

Specs an engineer can build from without asking

Because the motion was designed in the implementation's own vocabulary, the handoff spec could be exact: layer names, pixel paddings, color tokens, before/after hover states per sub-component. Engineering could start building the card system without a single clarifying round-trip — the spec left nothing to ask.

The token architecture that lets Solara's product surface carry this identity — semantic variables, mode-aware primitives — is a discipline of its own, and the documentation portal case study is where that story lives. The marketing pages deliberately sat outside that semantic layer: one-off expressive surfaces styled directly, where the product's systematic tokens would only have gotten in the way.

One page, one goal.

An IA stripped to a single conversion path

The old site scattered attention across navigation links competing for the same click. The redesign committed to one principle: one page, one goal. Fewer links, one primary call to action, and a scroll narrative that answers a developer's questions in the order they ask them — what is it, what does it look like, what can it do, who trusts it.

The page finally answered the question its GitHub-referred visitors arrived with — and the new-user growth that followed came through this page.

Responsive and accessible by default

The system scales from the 1440px marketing viewport down to mobile without forking the design — the same cards, the same motion logic, recomposed. In the design, CTAs and core information meet WCAG 2.1 AA contrast and focus standards.

A prototype precise enough to build from.

The final deliverable wasn't a picture of a website — it was an interactive Figma prototype with responsive breakpoints and interaction states, plus the annotated component specs above. For a fast-moving startup, that fidelity was the highest-leverage artifact of the project: it eliminated the interpretation gap that usually costs weeks of back-and-forth.

Want to look around yourself? Explore the interactive homepage prototype, or browse the curated sneak-peak design file below.

Design shipped, and the curve turned.

The homepage prototype was presented at an all-hands in January 2024 and approved with only minor changes requested — the design MVP landed within Q1, and the site launched in Q3 2024, a quarter ahead of the documentation portal.

The site launched into Solara's steepest growth year — monthly downloads grew 13× from the identity launch through late 2024, a curve the marketing site shares with the framework's engineering and the documentation portal rather than claims for itself. What the quarter after launch did bring through this page: 3k+ new users, several of them enterprise teams — the traction that laid the path for a seed round of funding.

Design as a trust signal

For developer tools, visual polish isn't vanity — it's a credibility proxy. Enterprise buyers evaluate framework maturity partly through the quality of its public-facing surfaces. A polished marketing site says "this team ships quality."

Design motion in the implementation's language

The pure-CSS constraint wasn't a limitation to work around — it was the design brief. Committing to opacity-and-color transitions early produced a motion language that was cheaper to build, faster to render, and more coherent than anything I'd have designed unconstrained.

Prototype fidelity eliminates ambiguity

The breakpoint-complete interactive prototype and pixel-annotated specs were the highest-leverage deliverables of the project. They cut implementation time and removed the interpretation back-and-forth that kills momentum in small teams — and they're why stakeholder buy-in arrived at the first all-hands, not the fifth.