TRAE logo
TRAE is an AI IDE from ByteDance, an AI-native code editor with code completion, AI chat and a builder mode that creates apps from natural language.
Also known as Trae AI, TRAE IDE
Looks better on a light background
npm i @dev.icons/reactimport { TraeIcon, Trae } from "@dev.icons/react";<TraeIcon size={32} />
<Trae size={32} />
Using an AI agent? Ask the Devicons MCP server for trae, or fetch its JSON from the Icons API.
About the TRAE logo
The TRAE mark is a blocky frame with two diamond “eyes” inside. The frame’s lower-left corner is stepped, which gives the shape the feel of a small screen or a friendly face. The full logo pairs it with a heavy “TRAE” wordmark whose last letter is an open bracket holding a diamond, echoing the mark. The mark and wordmark come from the vector assets on trae.ai.
The brand color is a bright mint green (#32F08C). It reads well on dark backgrounds but looks pale on white. The full logo has a black wordmark, so in dark themes use the monochrome version or the mark on its own.
When to use this logo
Use the TRAE logo in AI code editor comparisons, IDE and developer tool lists, setup guides for extensions or MCP servers, and AI coding stack diagrams. It pairs naturally with Cursor, Windsurf, Visual Studio Code, Kiro and GitHub Copilot, and with ByteDance or Doubao when you show the company and models behind it.