Facebook Color Codes
The exact blues Facebook uses today and used before, plus Messenger and Meta gradients, ready to copy.
CMYK values are formula conversions from sRGB, not a colour-managed profile. For print, let your printer match the hex or use the closest Pantone (2727 C is the usual stand-in for #1877F2).
Which blue is “the” Facebook blue?
There are two correct answers in 2026. Inside the product, from buttons to links to the active icon in the navigation, Facebook uses #1877F2 (RGB 24, 119, 242). The logo and app icon use a more saturated #0866FF (RGB 8, 102, 255), introduced with the February 2023 brand refresh together with a custom typeface. If you are matching a button or a link, take #1877F2; if you are placing the “f” icon on a poster, take #0866FF.
Everything older, #3B5998 and #4267B2, is the muted navy Facebook wore from 2005 until the 2019 redesign. Those are still the right codes if you are recreating something from that era, and still what half the internet quotes as “Facebook blue”, which is why so many icons in third-party sets look slightly off next to the real app.
A short history of the blue
Facebook is blue because Mark Zuckerberg is red-green colour-blind. As he told The New Yorker in 2010, blue is the richest colour for him: he can see all of it. The 2004 site launched with a dark navy header, and the wordmark settled on #3B5998, which lasted through the 2013 flat logo. The 2015 brand guidelines lightened it to #4267B2 for print and partners.
The 2019 “FB5” redesign was the big break: the navy header disappeared, pages went white on #F0F2F5, and the accent became the brighter #1877F2. Dark mode followed in 2020 with the #18191A background and #242526 cards. In 2021 the parent company became Meta with its own #0081FB blue, and in 2023 Facebook's own logo took the current electric #0866FF.
Where each colour shows up
| Hex | Name | Used for |
|---|---|---|
| #1877F2 | Facebook blue | Primary buttons, links, Like reaction, active tab, focus rings |
| #166FE5 | Hover blue | Primary button on hover; #1B74E4 appears as a pressed/variant shade |
| #0866FF | Brand blue | Logo, app icon, marketing since 2023 |
| #F0F2F5 | Light background | Page canvas behind white cards in light mode |
| #65676B | Secondary text | Timestamps, counts, placeholder text, inactive icons |
| #18191A / #242526 | Dark mode | Page background and card surface; #3A3B3C for hover and inputs |
| #31A24C | Online green | Active-now dot on avatars and in Messenger |
| #E41E3F | Notification red | Unread badges, errors, the Angry-adjacent alert red |
| #F33E58 / #F7B125 | Reactions | Love heart; Care, Haha and Wow yellow |
Messenger used a flat #0084FF icon until 2020, then a blue-purple-pink-orange gradient (#00B2FF → #006AFF → #A033FF → #FF5280 → #FF7061) that still powers the default chat bubbles and several chat themes. Meta uses #0081FB with a lighter gradient; WhatsApp is #25D366; Instagram keeps its sunset gradient (#F58529 → #DD2A7B → #8134AF → #515BD4). Use those for their own products, not for Facebook itself.
Accessibility: does white text on Facebook blue pass?
Calculated with the WCAG 2 formula, white on #1877F2 is 4.23:1. That passes AA for large text (18 pt, or 14 pt bold) and for UI components and icons, which is how Facebook uses it, but falls just short of the 4.5:1 required for small body text. The brand blue #0866FF gives 4.82:1 and passes AA for any text size. The old #3B5998 reaches 6.84:1, comfortably AA and AAA for large text.
On the interface side, secondary grey #65676B on white is 5.67:1 (AA) and dark-mode text #E4E6EB on #18191A is 14.1:1 (AAA). If you build something in Facebook's palette, keep small text in #050505 or #65676B on light surfaces and reserve the blue for buttons, links at 15 px or larger, and icons.
