#78350F — Tints, Shades & Color Values

Tailwind CSS amber-900 · Every value on this page is precomputed — copy what you need.

#78350F is a dark, vivid orange. In Tailwind CSS this exact color is the utility class amber-900 (e.g. bg-amber-900, text-amber-900). Its nearest CSS named color is saddlebrown (#8b4513). For readable text on a #78350F background, white text gives the strongest contrast (9.07:1). Because it is dark, #78350F suits text, navigation bars, and footers on light backgrounds, and its tints make natural hover and surface colors.

Color Values

Need these in another format? Use our hex to RGB converter for quick two-way conversion.

#78350F in Tailwind CSS (amber-900)

#78350F ships with Tailwind CSS as amber-900 — use it as bg-amber-900, text-amber-900, or border-amber-900. It sits at step 900 of the amber ramp; every other step links to its own page:

• 50
• 100
• 200
• 300
• 400
• 500
• 600
• 700
• 800
• 900
• 950

Browse the full Tailwind palette in the color library, or generate in-between steps with the tint & shade generator.

Tints of #78350F (Mixed with White)

Each step blends the base color toward white using new = old + (255 − old) × factor. Click a swatch to open it in the generator.

• 10% tint #864927 Copy
• 20% tint #935d3f Copy
• 30% tint #a17257 Copy
• 40% tint #ae866f Copy
• 50% tint #bc9a87 Copy
• 60% tint #c9ae9f Copy
• 70% tint #d7c2b7 Copy
• 80% tint #e4d7cf Copy
• 90% tint #f2ebe7 Copy

Shades of #78350F (Mixed with Black)

Each step blends the base color toward black using new = old × (1 − factor).

• 10% shade #6c300e Copy
• 20% shade #602a0c Copy
• 30% shade #54250b Copy
• 40% shade #482009 Copy
• 50% shade #3c1b08 Copy
• 60% shade #301506 Copy
• 70% shade #241005 Copy
• 80% shade #180b03 Copy
• 90% shade #0c0501 Copy

WCAG Contrast & Accessibility

Contrast ratios for text placed on a #78350F background. WCAG requires 4.5:1 for normal text (AA), 3:1 for large text (AA), and 7:1 for normal text (AAA).

If neither pure white nor pure black reaches the level you need, pick a lighter tint of #78350F from the ramps above as the background instead — small lightness moves change contrast quickly. Test any other pair with the free contrast checker.

More orange colors in the library: #713F12 (yellow-900), #7C2D12 (orange-900), #854D0E (yellow-800), #A16207 (yellow-700), #9A3412 (orange-800), #422006 (yellow-950).

Frequently Asked Questions

• What color is #78350F?

  #78350F is a dark, vivid orange — rgb(120, 53, 15). Its nearest CSS named color is saddlebrown. In Tailwind CSS it is amber-900.

• How do I make tints and shades of #78350F?

  Mix #78350F with white for tints and with black for shades. A 20% tint of #78350F is #935d3f and a 20% shade is #602a0c — the full 10%–90% ramps are precomputed on this page, or open #78350F in the generator for finer steps.

• What text color is readable on #78350F?

  White text gives the strongest contrast on a #78350F background at 9.07:1, which passes WCAG AA and AAA for normal text.

• What is the Tailwind CSS class for #78350F?

  amber-900 — use it as bg-amber-900, text-amber-900, or border-amber-900. The full amber 50–950 ramp is linked above.

Browse more colors in the color library, or start from any hex code on the HexTints homepage.