[Home](/index.md) › [Icons](/icons.md) › Codex

# Codex

Codex is OpenAI's AI coding agent for writing code and fixing bugs, available in ChatGPT, the Codex CLI, a desktop app and IDE integrations.

## At a glance

- **Page**: https://devicons.io/icons/codex/
- **Website**: https://openai.com/codex/
- **Brand guidelines**: https://openai.com/brand/
- **Also known as**: OpenAI Codex, Codex CLI
- **Tags**: [AI](/icons/tag/ai/), [Agents](/icons/tag/agents/), [Developer Tools](/icons/tag/developer-tools/), [CLI](/icons/tag/cli/), [OpenAI](/icons/tag/openai/)
- **Version added**: 1.2.0
- **Contrast**: needs a light backdrop on dark backgrounds

## Files

Each file is one variant of this logo. The component name is derived from the file name.

| File | Component | Color SVG | Monochrome SVG | Font class |
| --- | --- | --- | --- | --- |
| `codex-icon` | `CodexIcon` | https://devicons.io/devicons/icons/codex-icon.svg | https://devicons.io/devicons/font/codex-icon.svg | `devicons devicons-codex-icon` |
| `codex` | `Codex` | https://devicons.io/devicons/icons/codex.svg | https://devicons.io/devicons/font/codex.svg | `devicons devicons-codex` |

## Install and use

```bash
npm install @dev.icons/react  # or @dev.icons/vue, @dev.icons/svelte
```

### React

```tsx
import { CodexIcon } from "@dev.icons/react";
// Monochrome (inherits currentColor):
// import { CodexIcon } from "@dev.icons/react/mono";

<CodexIcon size={32} alt="Codex logo" />
```

### Vue

```vue
<script setup>
import { CodexIcon } from "@dev.icons/vue";
</script>

<template>
  <CodexIcon :size="32" alt="Codex logo" />
</template>
```

### Svelte

```svelte
<script>
  import { CodexIcon } from "@dev.icons/svelte";
</script>

<CodexIcon size={32} alt="Codex logo" />
```

### Raw SVG

```html
<img src="https://devicons.io/devicons/icons/codex-icon.svg" alt="Codex logo" width="48" height="48" />
```

### Icon font

```css
@import "devicons/css"; /* npm install devicons */
```

```html
<i class="devicons devicons-codex-icon"></i>
```

## About the Codex logo

The Codex mark is a rounded, cloud-like shape holding a terminal prompt: a chevron and an underscore, the ">_" you see at a command line. That fits a product that first shipped in April 2025 as the Codex CLI. In color, the shape is filled with a vertical gradient that runs from lavender (#B1A7FF) through mid blue (#7A9DFF) to deep blue (#3941FF).

The gradient symbol works on both light and dark backgrounds. The lockup puts it next to a black "Codex" wordmark, so on dark surfaces use the monochrome version with currentColor or a light fill.

## When to use this logo

Use Codex in AI coding assistant comparisons, agent tooling matrices and docs that cover the Codex CLI or IDE extensions. It also fits CI and code-review workflow diagrams where an agent opens pull requests. It pairs naturally with OpenAI, GitHub Copilot, Cursor and Claude Code, and with the terminal and editor icons in a developer-tools stack.

## Related icons

- [Junie](/icons/junie.md)
- [OpenCode](/icons/opencode.md)
- [Claude Code](/icons/claude-code.md)
- [Devin](/icons/devin.md)
- [goose](/icons/goose.md)
- [Kiro](/icons/kiro.md)
- [MetaGPT](/icons/metagpt.md)
- [Windsurf](/icons/windsurf.md)

## Browse the catalog
- Previous: [Codesee](/icons/codesee.md)
- Next: [Codio](/icons/codio.md)
- [All icons](/icons.md)