Tin
#919191
Light, neutral cool gray for crisp UI grids
About Tin
Tin is the kind of gray you notice on a clean metal appliance panel, when the light hits it evenly and the surface looks smooth but slightly restrained. Compared to Nickel, it feels a bit more neutral and less "finished-metal" in mood, with a softer, steadier read. It also stays clearer than Pedigrey, without that cabinet-worn softness drifting in.
I use Tin in dashboards and finance apps when I want structure to hold up under dense tables and tight cards, but I don't want the cool bite Nickel can bring. It's a solid backdrop for billing consoles, ops reporting screens, and analytics views for media platforms, especially when you need labels to stay crisp without the gray turning smoky or hazy.
One note: Tin's neutrality makes it a great bridge between cooler grays and warmer whites. Pair it with whites that aren't too blue, and keep your accents slightly brighter so they don't feel washed out next to this mid-gray balance.
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.
