Webull color palette
FinanceWebull's color identity centers on a vibrant blue, conveying trust and modernity in financial technology. The palette uses deep blues, light gradients, and neutral grays for clarity and user focus.
webull.comWebull colors
Click any swatch to copy its hex. Hover for RGB and HSL.
Brand colors
The colors people recognise.- Webull BluePrimary41, 98, 255
- Webull NavySecondary10, 30, 63
- Webull CyanAccent0, 193, 212
Surfaces
Page, cards and dividers.- Webull Light GrayBackground245, 247, 250
- Webull WhiteSurface255, 255, 255
- Webull Border GrayBorder227, 232, 238
Text
Three tiers of copy.- Webull Text BlackText26, 34, 51
- Webull Text GraySecondary text91, 107, 140
- Webull Muted GrayMuted text163, 173, 194
Semantic
Feedback and state colors.- Webull GreenSuccess0, 178, 111
- Webull YellowWarning255, 178, 0
- Webull RedError255, 76, 76
- Webull Info BlueInfo58, 141, 255
Use Webull's colors in your project
Pick a format, copy or download. Everything below is generated from the exact hex values above.
webull-palette-colors.css · Paste into your global stylesheet.
:root {
--info: #3A8DFF;
--error: #FF4C4C;
--accent: #00C1D4;
--border: #E3E8EE;
--primary: #2962FF;
--success: #00B26F;
--surface: #FFFFFF;
--warning: #FFB200;
--secondary: #0A1E3F;
--text-muted: #A3ADC2;
--background: #F5F7FA;
--text-primary: #1A2233;
--text-secondary: #5B6B8C;
}Contrast and accessibility
Every text tone tested against every surface, per WCAG 2.1.
Text on background
Needs 4.5:1 for body text
14.8:1
Pass
Text on surface
Needs 4.5:1 for body text
15.9:1
Pass
Secondary text on background
Needs 4.5:1 for body text
5.0:1
Pass
Secondary text on surface
Needs 4.5:1 for body text
5.3:1
Pass
Muted text on background
Needs 3:1 for large text
2.1:1
Fail
Muted text on surface
Needs 3:1 for large text
2.3:1
Fail
Webull background, border and text colors
The quiet part of the Webull palette: page background, card surfaces, dividers and the three text tones that sit on them. Click a value to copy it.
- Webull Light GrayBackground
- HEX
- RGB
- HSL
- Webull WhiteSurface
- HEX
- RGB
- HSL
- Webull Border GrayBorder
- HEX
- RGB
- HSL
- Webull Text BlackText
- HEX
- RGB
- HSL
- Webull Text GraySecondary text
- HEX
- RGB
- HSL
- Webull Muted GrayMuted text
- HEX
- RGB
- HSL
About Webull's colors
Webull's palette is based on a bold blue primary, complemented by deep navy and bright cyan accents for a modern, digital feel. Neutral grays and whites provide balance and readability.
Primary blue and cyan are analogous, creating harmony.
Deep navy provides contrast for navigation and headers.
Neutral grays support accessibility and reduce visual fatigue.
Psychology
Blue conveys trust, security, and professionalism, which are essential in finance. The accent cyan adds energy and a sense of innovation.
Evolution
Webull's palette has remained consistent since launch, with minor adjustments to gray tones for improved accessibility. The core blue and cyan have been stable, reinforcing brand recognition.
Where Webull uses each color
- Primary
Used for main action buttons, highlights, and the app's logo.
- Secondary
Appears in navigation bars, headers, and footers.
- Accent
Used for interactive elements, icons, and data highlights.
- Backgrounds
Light gray and white backgrounds are used throughout the app and website for clarity.
- Text
Primary and secondary text colors are used for body copy, labels, and UI elements.
- Semantic
Green, yellow, and red are used for financial indicators such as gains, warnings, and losses.
Webull color questions
Hex codes, RGB values, neutrals and how to use the palette.
The official Webull brand color is Webull Blue, hex code #2962FF.
Webull Blue (#2962FF) in RGB is 41, 98, 255. In CMYK it is 84, 62, 0, 0.
Webull uses several grays, including Webull Light Gray (#F5F7FA), Border Gray (#E3E8EE), and Muted Gray (#A3ADC2), for backgrounds and UI elements.
Primary blue is reserved for main actions and branding, while navy and cyan are used for navigation and highlights. Neutral grays and whites provide structure and support accessibility.
The secondary color is Webull Navy, #0A1E3F, and the accent is Webull Cyan, #00C1D4. Together with the primary they make up the three brand colors at the top of this page.
4 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 Webull's colors consistently when it generates UI.
Make something in the spirit of Webull
Start from this palette's mood and get an original 13-color system for your own project, contrast-checked and ready to export.