Brand
Guidelines

These are the design standards of Replit. Please reference these guidelines to ensure consistency and cohesiveness when creating for the brand. Here you will find guidance for brand elements from logos to brand voice.

If you have any questions, please reach out to the Replit Brand Team.

Logos

The Replit logo signals a shift from code to natural conversation. The speech-like shapes connect in uninterrupted dialogue, reflecting the fluid creativity that comes from effortless collaboration between people and technology.

This sense of openness carries through the subtly rounded forms, while the refined orange anchors the Replit look.

Download Logos
Primary Logo
Symbol
Stacked
Lockup Pill
Agent 4 badge

Clear Space

The Safe Zone surrounding the lockup is essential to ensure the lockup has ample breathing room from surrounding graphics and other elements.

Replit primary lockup safe zone diagram showing 'x' clear space around the wordmark and 0.5x clear space below
Replit symbol safe zone diagram showing 'x' clear space around the symbol and 0.5x clear space below
Replit stacked lockup safe zone diagram showing 'x' clear space around the lockup and 0.5x clear space below

Incorrect Usage

Do not alter the logo in any way. Avoid the following treatments for all version of the logos and lockups.

Replit logo recolored to a non-brand orange
Do not colorize the wordmark
Replit logo placed over a close-up of a person's face
Ensure lockup has enough contrast
Replit logo rendered as an outline only
Do not outline
Replit wordmark shown without the symbol
Do not use the wordmark by itself
Replit logo with a drop shadow applied
Do not add effects
Replit logo rotated off the baseline
Do not rotate at an angle
Black Replit logo placed on an orange background
Do not use black lockup on orange
Replit logo stretched and distorted horizontally
Do not stretch the lockup

Logo Animation

Use for product moments, intros, and short social cuts. Three crops included.

Color

This is our full brand color palette. Derived from Replit Orange, this palette and its supporting colors are meant to complement each other and account for different needs and use cases across all brand touchpoints. Use these color proportions as an approximate guide for how to implement color.

Typography

Diatype is our brand typeface. Designed by Dinamo Typefaces, we've evolved our treatment of Diatype across our brand. A warm yet sharp grotesque, Diatype is ideal for text and reading on screen.

AaBbCc

Type Scale

HEADLINE
DIATYPE REGULAR
LINE HEIGHT: 95%
TRACKING: -3%
Put your ideas to work.
SUBHEAD
DIATYPE REGULAR
LINE HEIGHT: 100%
TRACKING: -2%
Subhead is smaller than Headline to create contrast but also retain consistency.
BODY
DIATYPE REGULAR
LINE HEIGHT: 130%
TRACKING: 0%
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
FOOTNOTE / LABEL
DIATYPE SEMI-MONO REGULAR
LINE HEIGHT: 130%
TRACKING: 5%
Diatype semi-mono should only be used in footnotes and labels.
Type hierarchy scale diagram showing 'Put your idea to work.' headline at 2x and a subhead beneath it at x
Type paragraph spacing diagram showing baseline grid relationships between headline, subhead, and body copy

Icons

As we expand the Agent 4 brand, feature icons have been developed based on the Agent 4 visual style. Think of them as an extension of the main product icon. The look and motion of icons should feel like part of the same family.

Download Icons
Build Together
PNG
Design Freely
PNG
Move Faster
PNG
Ship Anything
PNG

Downloads

This page contains downloadable files to our brand resources, which include logos, typefaces, graphic templates, and icons. Contact the Replit Brand Team for more information.

Complete Brand Kit

Download

Logo Kit

Download

Primary Logo Animation

Download

Replit Agent 4 Animation

Download

Feature Icons

Download

Feature Icons Animations

Download