Meteor
#bb7431
Richer meteor orange-brown with smoky lift
About Meteor
Meteor looks like the toast under a copper pan, but it stops short of full orange heat. Compared to Copper, it's less metal-dense and a bit lighter, so it doesn't feel heavy. Compared to Molten Caramel, it's less sticky-cocoa and more ember-brown, with a smoother yellow-brown undertone instead of that orange-leaning caramel pull. And next to Brown Alpaca, it holds more saturation, so it reads warmer and more present rather than dry earth.
For UI, it's my soft-ember anchor when you need warmth that still feels crisp. Think product card headers for snacks and coffee brands, hospitality wayfinding panels, and e-commerce checkout components where you want the background to guide attention without turning into a deep brown or a bright amber. It also photographs well for packaging mockups because it keeps its color in mid-light instead of shifting muddy.
If you pair it with cream, keep the accents slightly cooler (warm grays can work too), otherwise it stacks with other browns and starts to blur together.
Code snippets
Copy this color into your project.
Contrast checker
WCAG 2.1 contrast ratios. AA requires 4.5:1 for normal text, 3:1 for large. AAA requires 7:1 / 4.5:1.
On White #ffffff
On Gray 100 #f5f5f5
On Gray 900 #18181b
On Black #000000
Variations
Shades
Darker variations, created by mixing toward black.
Tints
Lighter variations, created by mixing toward white.
Tones
Muted variations, created by reducing saturation.
Hues
Hue rotations around the color wheel.
Temperatures
Warm and cool shifts of this color.
Color harmonies
Suggested palettes
Palettes built around this color.
Community palettes
Published palettes that include this color.