With the launch of Graphite's AI code review features, we're elevating the code review workflow from the moment teams enable them in their repositories. In the same way, we wanted to make sure that the instant a potential user arrives on our home page, they're greeted with an experience that sparks curiosity and excitement about Graphite. To achieve this, we had to rethink how we visually represented our brand.

We began with a strong foundation set by an external design agency a few years ago, but soon realized the need for greater flexibility and control to align all of the design elements with our brand vision. This time around, we brought the entire redesign of our landing page in-house. We learned—and grew—a lot as a team, brand, and product during this journey, and we’d like to share some of the details and processes that helped us shape the new landing page’s final outcome.

The process: from divergent ideas to a cohesive design

Our CEO, Merrill Lutsky, has a strong sense of Graphite’s brand identity, and being able to partner closely with him was key for shaping the final design. When asked about his vision for the redesign, Lutsky recalls, “I wanted our new landing page to be striking, memorable, and on a more meta level, to communicate to potential users how much we care about getting the details right, starting with how we present Graphite to the world.” 

We explored various themes in our early design phases, from literal graphite and carbon textures, to more abstract visuals like repeating patterns and colors representing the stacked diffs workflow. We ultimately gravitated toward a theme of neon lighting inspired by the art of Ivan Navarro.

Exploration of different themes for the art direction ranging from abstract to literal.

Refining the neon lighting concept: look and feel in the top row, and layout in the bottom row.

The team then spent considerable time on different applications of this concept, particularly in the hero section of the landing page. We explored how neon light could interact with materials such as glass, and experimented with blending color modes where multiple colors like blue and orange—our brand colors—merge to create a white light. These explorations helped us arrive at a brand experience that was compelling and distinctly Graphite.

The new, illuminated Graphite logo gives the page layers of depth, while subtly hinting at the concept of stacking—the central idea to Graphite’s workflow, where engineers keep themselves unblocked and drive development forward by creating organized “stacks” of small, dependent code changes. “I’m really proud of both the concept and the finished product,” Lutsky says. “It’s powerful, authentic to Graphite, and unlike any other landing page we’ve seen.”

Design challenges and solutions

The transition from initial ideas to implementation was not without its challenges. We started playing around with how light could define the page's look, using neon strokes and floating shapes to create something eye-catching. We also incorporated more realistic elements—like how light casts shadows, reflects off surfaces, and changes the mood of an image.

This led us to experiment with tools like Blender, a 3D design software that allowed us to model the physical properties of neon light, rendering it realistically on the screen. Though it was time consuming, our team embraced this opportunity to expand our skill set by learning new design tools and techniques (with some help from @blenderguru) to bring our vision to life.

Mockups of the hero section using Blender, Photoshop, After Effects, and Figma.

This neon theme carried through to the footer design, where we asked ourselves: how can we capture more properties of light here? The result was an interactive logo that, when hovered over, split into its component parts, revealing subtle light refractions and brand colors.

We applied these design principles to the customer logos as well. Rather than leaving them as static images, we brought them to life with subtle animations that mimic the movement of light. The inspiration for this came from designer Rauno Freinberg, who frequently uses subtle movements and layered visual elements to elevate user interactions.

Technical execution

From a technical perspective, implementing the landing page redesign involved a lot of creative engineering. Our in-house approach enabled us to work closely with our engineering team to make sure implementation was both visually impactful and performant. It wasn’t straightforward—integrating complex blend modes, light effects, and substantial blurs presented significant technical challenges. Once the visual effects implementation was complete, we then had to face the balancing act of ultra-high fidelity and broad accessibility. Initially the site performed well on more powerful devices with high-resolution monitors, but struggled to render on mid-range laptops and mobile devices.  

To overcome this, we adopted a lightweight testing approach that mixed manual and automated methods to achieve cross-device compatibility and performance. Tools like BrowserStack were helpful for testing across various browsers and devices, while Chrome DevTools helped us monitor and optimize React re-renders and performance metrics. Additionally, leveraging Next.js in our development significantly enhanced our SEO through server-side rendering (SSR) and improved performance, especially in managing images and dynamic components. 

We always dogfood our products before we release them to the public, and we took the same approach to this redesign project. One of the ways we did this was by bringing our redesign efforts to our company-wide weekly show-and-tell sessions to share progress and open up conversations around the project. This meant we could receive feedback in real time, quickly iterate, and refine our more abstract ideas, while making sure that the final product not only met our aesthetic standards but also functioned smoothly across different environments. This close-knit collaboration and thorough testing protocol were essential in overcoming the technical hurdles of this ambitious redesign.

Our collaborative approach also revealed a key insight: by treating our landing page with the same iterative mindset we apply to product development, we can continuously improve and experiment long after launch. Unlike the traditional agency model, where updates and iterations are limited by the length of the contract, our internal team had the flexibility to treat the site as a living, evolving product. This allowed us to tweak copy, adjust visuals, and experiment with different design elements to align the landing page with our evolving brand.

Leadership buy-in

Taking on a project like this in-house without a dedicated Marketing Design and Engineering team can be demanding. Not only does it require people to ramp up on skills and technologies that they don’t use everyday, it also requires buy-in from leadership to understand that it’s a long-term investment—one that gives us control, flexibility, and the ability to experiment much quicker going forward. 

“We had to carve out the time to do this redesign amongst product updates, project planning, hiring, design critiques, meetings, office hours, and a myriad of other day-to-day things we do at Graphite,” explains Xiulung Choy, the company’s Design Lead. “Early on in the process, we tried to sprint out a redesign over two weeks. Our CEO, Merrill, asked me if it was something I was proud of. I told him, ‘not exactly, but this is what we could produce in two weeks.’ He asked me to continue working on it to arrive at something we both felt good about with the agreement that the timeline is as long as it takes.”

Choy continues, “this project would have been impossible without that mutual understanding with the leadership team that ideas need time to develop, but the investment is worthwhile. It helped us create something we're proud to put our name on and that we can easily improve on in the future.”

Final thoughts: aligning brand and product

Bringing the redesign of our landing page in-house allowed us to infuse our brand identity into every corner of the result. This approach also provided us the control and flexibility needed to iterate rapidly, so we could craft an experience that we were truly excited about. While this required more resources and careful prioritization, the end result is a site that feels authentic to who we are and what we offer: a powerful, modern platform that helps the world’s fastest engineering teams build and ship high-quality software.