Bank of America color palette
FinanceBank of America's color identity is built around a deep blue primary, complemented by a bold red and a palette of clean neutrals. The system reflects trust, stability, and American heritage across digital and print assets.
bankofamerica.comBank of America colors
Click any swatch to copy its hex. Hover for RGB and HSL.
Brand colors
The colors people recognise.- BofA Deep BluePrimary1, 33, 105
- BofA Flag RedSecondary212, 0, 26
- BofA Accent BlueAccent0, 150, 214
Surfaces
Page, cards and dividers.- BofA WhiteBackground255, 255, 255
- BofA Light GraySurface244, 244, 244
- BofA Border GrayBorder209, 211, 212
Text
Three tiers of copy.- BofA BlackText26, 26, 26
- BofA CharcoalSecondary text77, 77, 79
- BofA Muted GrayMuted text118, 118, 118
Semantic
Feedback and state colors.- BofA Success GreenSuccess0, 128, 96
- BofA Warning YellowWarning255, 182, 0
- BofA Error RedError212, 0, 26
- BofA Info BlueInfo0, 150, 214
Use Bank of America's colors in your project
Pick a format, copy or download. Everything below is generated from the exact hex values above.
bank-of-america-palette-colors.css · Paste into your global stylesheet.
:root {
--info: #0096D6;
--error: #D4001A;
--accent: #0096D6;
--border: #D1D3D4;
--primary: #012169;
--success: #008060;
--surface: #F4F4F4;
--warning: #FFB600;
--secondary: #D4001A;
--text-muted: #767676;
--background: #FFFFFF;
--text-primary: #1A1A1A;
--text-secondary: #4D4D4F;
}Contrast and accessibility
Every text tone tested against every surface, per WCAG 2.1.
Text on background
Needs 4.5:1 for body text
17.4:1
Pass
Text on surface
Needs 4.5:1 for body text
15.8:1
Pass
Secondary text on background
Needs 4.5:1 for body text
8.4:1
Pass
Secondary text on surface
Needs 4.5:1 for body text
7.7:1
Pass
Muted text on background
Needs 3:1 for large text
4.5:1
Pass
Muted text on surface
Needs 3:1 for large text
4.1:1
Pass
Bank of America gray and neutral colors
The quiet part of the Bank of America palette: page background, card surfaces, dividers and the three text tones that sit on them. Click a value to copy it.
- BofA WhiteBackground
- HEX
- RGB
- HSL
- BofA Light GraySurface
- HEX
- RGB
- HSL
- BofA Border GrayBorder
- HEX
- RGB
- HSL
- BofA BlackText
- HEX
- RGB
- HSL
- BofA CharcoalSecondary text
- HEX
- RGB
- HSL
- BofA Muted GrayMuted text
- HEX
- RGB
- HSL
About Bank of America's colors
Bank of America's palette is rooted in the American flag, using blue and red for brand recognition and trust. Neutrals provide clarity and accessibility in digital interfaces.
Primary blue and red create a patriotic, high-contrast pairing.
Accent blue and neutrals support hierarchy and readability.
Success, warning, and error colors are distinct for accessibility.
Psychology
Deep blue conveys security, professionalism, and reliability, which are essential in financial services. Red adds energy and visibility for calls to action.
Evolution
The palette has remained consistent for decades, reinforcing brand recognition. Minor adjustments in gray tones and accent blues have improved digital accessibility.
Where Bank of America uses each color
- Primary
Used for navigation bars, headers, and key brand elements.
- Secondary
Appears in the logo, call-to-action buttons, and highlights.
- Accent
Used for links, icons, and interactive UI elements.
- Backgrounds
White and light gray backgrounds are used for content areas and forms.
- Text
Primary and secondary text colors are used for body copy and headings.
- Semantic
Success, warning, and error colors are used in alerts, notifications, and form validation.
Bank of America color questions
Hex codes, RGB values, neutrals and how to use the palette.
The official Bank of America primary color hex code is #012169. This deep blue is used across all major brand touchpoints.
The RGB value for #012169 is (1, 33, 105) and the CMYK equivalent is (100, 87, 9, 56). Always use #012169 for digital applications.
Bank of America uses #F4F4F4 (BofA Light Gray) for surfaces and #D1D3D4 (BofA Border Gray) for dividers and backgrounds. These neutrals support clarity and accessibility.
Use BofA Deep Blue (#012169) for primary navigation and branding, with BofA Flag Red (#D4001A) for emphasis and calls to action. Neutrals and semantic colors should be used for backgrounds, text, and status indicators to maintain consistency.
The secondary color is BofA Flag Red, #D4001A, and the accent is BofA Accent Blue, #0096D6. Together with the primary they make up the three brand colors at the top of this page.
6 of 6 text and background pairings meet WCAG 2.1 AA contrast. The contrast section above shows every pairing with its exact ratio.
Use the export block on this page. It gives you CSS custom properties, a Tailwind config, W3C design tokens or a shadcn/ui theme built from these exact hex values, with copy and download buttons.
Yes. Export the Claude Code skill, Cursor rules or Codex prompt from the same block. The agent then applies Bank of America's colors consistently when it generates UI.
Make something in the spirit of Bank of America
Start from this palette's mood and get an original 13-color system for your own project, contrast-checked and ready to export.