OpenAI

<!-- Generated by ExtractVibe — https://extractvibe.com/brand/openai.com -->
<!-- Extracted: 2026-04-26T13:05:04.688Z | Schema: v1 | Quality: 100/100 -->
---
version: alpha
name: "OpenAI"
description: "OpenAI projects a serious and enthusiastic yet accessible image, focusing on groundbreaking AI research with a clear mission to build safe and beneficial artificial general intelligence. Their brand aesthetic is clean, modern, and understated, reflecting a focus on substance over flash."
colors:
  primary: "#000000"
  tertiary: "#3b82f6"
  surface: "#ffffff"
  on-surface: "#000000"
typography:
  headline-lg:
    fontFamily: "OpenAI Sans"
    fontSize: "22px"
    fontWeight: "500"
    lineHeight: "27.72px"
    letterSpacing: "-0.22px"
  body-md:
    fontFamily: "OpenAI Sans"
    fontSize: "17px"
    fontWeight: "400"
    lineHeight: "27.999px"
    letterSpacing: "-0.17px"
rounded:
  sm: "40px"
  lg: "9999px"
  full: "9999px"
spacing:
  base: "2px"
  xs: "1px"
  sm: "2px"
  md: "4px"
  lg: "6px"
  xl: "8px"
components:
  button-ghost:
    textColor: "#000000"
    rounded: "40px"
    padding: "8px 16px"
    fontSize: "13px"
    fontWeight: "500"
    borderColor: "#e5e7eb"
  button-secondary:
    backgroundColor: "#f1f1f1"
    textColor: "#000000"
    rounded: "9999px"
    padding: "0px 20px 0px 18px"
    fontSize: "14px"
    fontWeight: "500"
    borderColor: "#e5e7eb"
  button-outline:
    textColor: "#000000"
    rounded: "9999px"
    padding: "0px 12px"
    fontSize: "14px"
    fontWeight: "500"
    borderColor: "#000000"
    borderWidth: "1px"
    boxShadow: "rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0, 0.02) 0px 4px 6px 0px, rgba(0, 0, 0, 0.05) 0px 0px 2px 0px"
---

# OpenAI — Design System

## Overview

OpenAI's design system embodies the archetypes of The Sage and The Creator, manifesting a visual language that is both innovative and mission-driven. It aligns with the aesthetic principles observed in comparable brands such as Google, Microsoft, DeepMind, and IBM, emphasizing clarity, precision, and a focus on substantive content. The emotional register is serious and enthusiastic, yet accessible, reflecting the organization's commitment to groundbreaking AI research and the safe, beneficial development of artificial general intelligence. This design approach prioritizes substance over superficiality, ensuring that the interface serves as a transparent conduit for complex information and advanced technology.

This design system is not flamboyant or trend-driven. It avoids decorative elements and excessive ornamentation, instead opting for a clean, modern, and understated aesthetic. The visual presentation is deliberately unflashy, designed to foster trust and convey authority without relying on overt stylistic gestures. Every design decision supports the core mission, ensuring that the user experience is intuitive, efficient, and reflective of OpenAI's dedication to intellectual rigor and responsible innovation. The focus remains on the utility and impact of the technology, rather than the visual spectacle.

**Key characteristics:**

- Vibe — innovative, serious, mission-driven, modern, accessible, clean
- Archetypes — The Sage, The Creator
- Comparable to — Google, Microsoft, DeepMind, IBM
- Design era — contemporary-minimal
- Emotional tone — authoritative-optimistic
- Target audience — Researchers, developers, enterprise clients, policymakers, and a general public interested in the future of AI.
- Visual energy — 4/10 (moderate)

## Colors

The color palette is intentionally minimalist, centered on a primary black (#000000) and a surface white (#ffffff). This stark contrast signals clarity, seriousness, and a foundational approach to complex problems. The absence of vibrant accent colors reinforces the brand's focus on substance and intellectual rigor, avoiding distractions. This binary palette communicates a clean, modern aesthetic, aligning with the innovative and mission-driven character of OpenAI by prioritizing readability and directness.

### Light mode

| Role | Hex | Name |
|------|-----|------|
| primary | `#000000` | Black |
| accent / tertiary | `#3b82f6` | Dodger Blue |
| background | `#ffffff` | White |
| text | `#000000` | Black |

## Typography

The type system exclusively employs OpenAI Sans. This choice ensures brand consistency and legibility across all platforms. The hierarchy is established through variations in weight and size, not through multiple font families. This approach communicates a unified, authoritative voice, reinforcing the brand's serious and mission-driven character. The clean lines and modern proportions of OpenAI Sans reflect the innovative and accessible nature of the organization, prioritizing clarity and directness in information delivery.

### Font families

| Family | Role | Source | Weights |
|--------|------|--------|---------|
| OpenAI Sans | body | self-hosted | 400, 500 |
| OpenAI Sans | heading | self-hosted | 500 |

### Type scale

| Role | Family | Size | Weight | Line height | Letter spacing |
|------|--------|------|--------|-------------|----------------|
| Heading 2 | OpenAI Sans | 22px | 500 | 27.72px | -0.22px |
| Body | OpenAI Sans | 17px | 400 | 27.999px | -0.17px |

### Conventions

- Heading case — sentence-case
- Body line-height — 27.999px

## Layout

- Base spacing unit — `2px`

## Elevation & Depth

### Shadows

| Context | Value |
|---------|-------|
| element | `rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0, 0.06) 0px 2px 5px 0px, rgba(0, 0, 0, 0.01) 0px 4px 4px 0px` |
| element | `rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0, 0.02) 0px 4px 6px 0px, rgba(0, 0, 0, 0.05) 0px 0px 2px 0px` |

## Shapes

Border-radius scale:

- `sm` — 40px
- `lg` — 9999px
- `full` — 9999px (pill / circular)

## Components

### Buttons

**Ghost**

- Text — `#000000`
- Radius — `40px`
- Padding — `8px 16px`
- Font size — `13px`
- Font weight — `500`
- Border — ` solid #e5e7eb`
- Sample copy — "Skip to main content"

**Secondary**

- Background — `#f1f1f1`
- Text — `#000000`
- Radius — `9999px`
- Padding — `0px 20px 0px 18px`
- Font size — `14px`
- Font weight — `500`
- Border — ` solid #e5e7eb`
- Sample copy — "EnglishUnited States"

**Outline**

- Text — `#000000`
- Radius — `9999px`
- Padding — `0px 12px`
- Font size — `14px`
- Font weight — `500`
- Border — `1px solid #000000`
- Shadow — `rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0, 0.02) 0px 4px 6px 0px, rgba(0, 0, 0, 0.05) 0px 0px 2px 0px`
- Sample copy — "Learn about ChatGPT Business"

## Do's and Don'ts

### Do

- Utilize OpenAI Sans (self-hosted) for all typography, with 500 weight for headings and 400/500 weights for body text.
- Maintain sentence-case for all headings to ensure a consistent, clear tone.
- Employ a minimalist color palette: #000000 for primary text and elements, #3b82f6 as a distinct accent color, and #ffffff for backgrounds.
- Implement a base spacing unit of 2px for consistent visual rhythm and element alignment.
- Design buttons with distinct styles: 'ghost' buttons with #000000 text, #e5e7eb border, and 40px radius; 'secondary' buttons with #f1f1f1 background, #000000 text, #e5e7eb border, and 9999px radius; and 'outline' buttons with #000000 text, #000000 border, and 9999px radius.
- Apply subtle, almost imperceptible shadows (rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0) on specific elements, avoiding heavy or multi-layered shadow effects.
- Ensure body text has a line-height of approximately 28px (27.999px) for optimal readability.

### Don't

- Avoid the use of gradients in any visual elements, as none were detected in the brand's current styling.
- Do not use emojis in any official communication or content, as the brand maintains a serious and professional tone.
- Refrain from using exclamations in copy, maintaining a matter-of-fact and authoritative voice.
- Do not use title case for headings; all headings must adhere to sentence case.
- Avoid overly playful or casual language; maintain a serious and enthusiastic tone.
- Do not introduce new font families; strictly adhere to OpenAI Sans for all typographic needs.
- Avoid bold or vibrant color palettes beyond the defined primary, accent, and background colors; maintain a limited and clean color scheme.

*Source — merged*

## Voice

### Tone (1–10 scale)

| Axis | Score | Lean |
|------|-------|------|
| Formal ↔ Casual | 3/10 | formal |
| Playful ↔ Serious | 9/10 | serious |
| Enthusiastic ↔ Matter-of-fact | 7/10 | matter-of-fact |
| Respectful ↔ Irreverent | 2/10 | respectful |
| Technical ↔ Accessible | 5/10 | balanced |

### Copywriting style

- Avg. sentence length — 8 words
- Vocabulary — moderate
- Jargon — some
- CTA style — action-oriented imperative verbs and direct calls to engage with products

### Sample copy

> We believe our research will eventually lead to artificial general intelligence, a system that can solve human-level problems.

> Building safe and beneficial AGI is our mission.

> Introducing GPT-5.5

> What can I help with?

> Making ChatGPT better for clinicians

## Logos

| Type | Variant | Format | URL | Confidence |
|------|---------|--------|-----|------------|
| primary | — | svg | [link](https://img.loadlogo.com/openai.com) | 100% |
| favicon | — | ico | [link](brands/openai.com/logo-0.ico) | 95% |
| favicon | — | png | [link](brands/openai.com/logo-1.png) | 95% |
| favicon | — | svg | [link](brands/openai.com/logo-2.svg) | 95% |
| primary | — | svg | [link](brands/openai.com/logo-svg-3.svg) | 90% |
| primary | — | svg | [link](brands/openai.com/logo-svg-4.svg) | 90% |
| primary | — | svg | [link](brands/openai.com/logo-svg-5.svg) | 90% |
| primary | — | svg | [link](brands/openai.com/logo-svg-6.svg) | 90% |
| primary | — | svg | [link](brands/openai.com/logo-svg-7.svg) | 90% |
| primary | — | svg | [link](brands/openai.com/logo-svg-8.svg) | 90% |
| primary | — | svg | [link](brands/openai.com/logo-svg-9.svg) | 90% |
| primary | — | svg | [link](brands/openai.com/logo-svg-10.svg) | 90% |

## Sources

- Official brand guidelines — https://openai.com/brand
- Live brand page — https://extractvibe.com/brand/openai.com
- Raw JSON — https://extractvibe.com/api/brand/openai.com
- DESIGN.md (this file) — https://extractvibe.com/api/brand/openai.com/design.md
- Extracted — 2026-04-26T13:05:04.688Z
- Generator — ExtractVibe vv1
- Quality score — 100/100

npx @google/design.md lint DESIGN.md
npx @google/design.md export --format tailwind DESIGN.md