Brat Color Code — The Official Brat Green Hex Code (#89CC04)

The brat color code is #89CC04 — a bold, saturated yellow-green used on Charli XCX's Brat album cover. This specific shade has become a global cultural phenomenon, defining the visual style of an entire generation (read about the full brat summer meaning here). This post contains the exact hex, RGB, and HSL values plus how to use them anywhere.

This is the color Charli XCX used on the June 2024 Brat album cover. It became the defining visual of "brat summer" and spread across TikTok, Instagram, and fashion. It is the core of the entire movement.

To use this exact color right now, open the brat green generator. This tool ensures you never have to guess which green is the right one. While some people use fan-created variations like #C1FF00 or #8ACE00, the official color remains the most authentic choice for any serious project.

What Does Brat Green Look Like?

Brat green is a saturated yellow-green that sits in a unique spot on the color wheel. It is significantly brighter than a traditional olive but much darker and more grounded than a neon lime.

The color provides exceptionally high contrast against black or white text, making it perfect for typography-heavy designs. It reads as "loud" and intentional, with nothing subtle about its presence in a layout.

On screen, it appears almost fluorescent, especially on high-quality OLED displays. It is closer to a classic chartreuse than it is to a pure lime green. This specific intensity is why it works so well for the aesthetic.

This is exactly why the color works for the brat aesthetic — it is impossible to ignore. It demands your attention the moment it appears on your social media feed or on a billboard.

Why Did This Color Get So Popular?

Charli XCX released Brat on June 7, 2024. The album cover was just the word "brat" in lowercase Arial on this green background. There was no decoration, no photography, and no fancy graphics — just pure color and type.

That extreme minimalism made the color itself the entire identity. Fans started recreating it immediately, replacing the word "brat" with their own names and phrases. It became a template for self-expression.

This "raw" and "messy" look was a direct reaction to the overly polished and filtered aesthetic of the 2010s. It felt honest, DIY, and accessible. You didn't need to be a designer to make something that looked cool and trendy.

Within weeks, the format spread across every social platform. By mid-2024, "brat summer" was one of the most searched cultural terms online. The color became a visual shorthand that everyone recognized instantly.

The trend even reached the highest levels of politics. The Kamala Harris presidential campaign adopted the aesthetic when Charli XCX posted "kamala IS brat." This took the color into mainstream news coverage and cemented its legacy.

The simplicity of the design meant it could be adapted for anything. From luxury fashion brands to small independent creators, everyone used this green to tap into the cultural zeitgeist of the moment.

Other Brat Colors — The Full Palette

While #89CC04 is THE brat color, the complete aesthetic also uses companion colors to create a full design system. Use these hex codes to keep your designs authentic.

These four shades work together to create the "raw" look that defined 2024. All four are available as one-click presets in our free brat generator, allowing you to switch between themes instantly.

The "Brat Pink" is often used for more feminine or "coquette" versions of the trend, while the black and white versions are perfect for those who want a more muted or high-fashion look.

Using the full palette allows for more variety while keeping the core vibe consistent. Whether you are making a poster or a profile picture, these values ensure your project looks authentic to the original vision.

The goal of this palette is to maintain high contrast. No matter which combination you choose, the text should always be easy to read and stand out clearly against the background.

How to Use #89CC04 in Your Projects

For developers, here are the three main formats you will need to implement the brat aesthetic in your code. These ensure the color renders correctly across different browsers and devices:

/* Hex */
background-color: #89CC04;
/* RGB */
background-color: rgb(137, 204, 4);
/* HSL */
background-color: hsl(80, 96%, 41%);

If you are using Tailwind CSS, you can extend your theme to include the custom green shade for easier use across your components. This is the best way to maintain consistency in your project:

module.exports = {
  theme: {
    extend: {
      colors: {
        'brat-green': '#89CC04',
      }
    }
  }
}

After updating your config, you can simply use the className="bg-brat-green" in your HTML code. This makes it incredibly easy to apply the color to buttons, cards, or backgrounds.

Or skip the manual setup — the brat album cover generator uses this exact color by default. It is the easiest way to join the trend without needing any technical skills.

Frequently Asked Questions

Written by the ibratgenerator.com team | Updated: May 2026