Patagonia Color Palette

Select any value to copy it.

• Patagonia Sky Blue

  Primary

  #0061ACrgb(0, 97, 172)hsl(206, 100%, 34%)

  Closest in ArchiveSteel Dusk Pure
  Closest in Archive: Steel Dusk Pure

• Sunset Yellow

  Secondary

  #F4D54Frgb(244, 213, 79)hsl(49, 88%, 63%)

  Closest in ArchiveAmber Tone Bright
  Closest in Archive: Amber Tone Bright

• Mountain Orange

  Secondary

  #E94E1Brgb(233, 78, 27)hsl(15, 82%, 51%)

  Closest in ArchiveVermillion Core Pure
  Closest in Archive: Vermillion Core Pure

• Forest Black

  Neutral

  #0F1F2Ergb(15, 31, 46)hsl(209, 51%, 12%)

  Closest in ArchiveSapphire Ink Clear
  Closest in Archive: Sapphire Ink Clear

Can it carry text? (WCAG contrast)

Each color as text on white and on black. AA means body text passes. Select a ratio to open the pair in the contrast checker.

• Patagonia Sky BlueAaon white6.35:1AAPatagonia Sky Blue: Open in contrast checkerAaon black3.31:1Large text onlyPatagonia Sky Blue: Open in contrast checker
• Sunset YellowAaon white1.45:1Not for textSunset Yellow: Open in contrast checkerAaon black14.48:1AASunset Yellow: Open in contrast checker
• Mountain OrangeAaon white3.77:1Large text onlyMountain Orange: Open in contrast checkerAaon black5.57:1AAMountain Orange: Open in contrast checker
• Forest BlackAaon white16.72:1AAForest Black: Open in contrast checkerAaon black1.26:1Not for textForest Black: Open in contrast checker

About this palette

Patagonia's logo is a literal painting: the silhouette of Mount Fitz Roy in Argentina, sky behind it gradient-shifting from yellow at the horizon to blue-violet up top. The brand permits the full gradient on print, but in digital contexts the dominant value is the deep sky blue (#0061AC). The palette signals the outdoors first, the brand second.

Copy as code

Every token name carries the brand, so two brands can share one stylesheet.

:root {
  --patagonia-sky-blue: #0061ac;
  --patagonia-sunset-yellow: #f4d54f;
  --patagonia-mountain-orange: #e94e1b;
  --patagonia-forest-black: #0f1f2e;
}

@theme {
  --color-patagonia-sky-blue: #0061ac;
  --color-patagonia-sunset-yellow: #f4d54f;
  --color-patagonia-mountain-orange: #e94e1b;
  --color-patagonia-forest-black: #0f1f2e;
}

module.exports = {
  theme: {
    extend: {
      colors: {
        "patagonia-sky-blue": "#0061ac",
        "patagonia-sunset-yellow": "#f4d54f",
        "patagonia-mountain-orange": "#e94e1b",
        "patagonia-forest-black": "#0f1f2e",
      },
    },
  },
};

Source: https://www.patagonia.com/ · As of 2026-05-03 · This page is an unofficial reference. Color values are factual sRGB hex codes and not subject to copyright; the Patagonia name and any associated marks belong to their owner. Request removal via support.

More from Consumer Brands