What colors are in the Ledger Green palette?

The Ledger Green palette has 5 colors: #0C1A14, #123524, #1F8A5B, #8FD3B0, #EEF6F1.

Where can I use this palette?

It's a Muted palette — well suited to editorial layouts, minimal ui, photography portfolios, modern brands.

Is the Ledger Green palette accessible?

Its darkest and lightest colors have a contrast ratio of 16.27:1. 4 color pairs in it meet WCAG AA for text.

How do I use this palette in CSS?

Copy the CSS custom properties (:root variables) from the Export section, or grab any single hex with one click.

Can I export the Ledger Green palette?

Yes — export to CSS, SCSS, Tailwind config or JSON, or copy all hex codes at once.

Text #0C1A14 Graphite Secondary #123524 Sacramento Green Primary #1F8A5B Sea Green Accent #8FD3B0 Medium Aquamarine Surface #EEF6F1 White Smoke

Ledger Green

Professional Accounting & finance 5 colors

The green is ledger-green, not go-green — desaturated so gains and losses stay legible side by side. Ink is near-black for dense numeric tables.

Open in generator All palettes

Text Graphite — #0C1A14

Secondary Sacramento Green — #123524

Primary Sea Green — #1F8A5B

Accent Medium Aquamarine — #8FD3B0

Surface White Smoke — #EEF6F1

Contrast matrix

Text on Surface 16.27 AAA

Primary on Surface 3.94 AA Large

Text on Secondary 1.33 Fail

Surface on Primary 3.94 AA Large

Accent on Text 10.32 AAA

Ratios are WCAG 2 contrast between the roles as assigned above. AA needs 4.5:1 for body text, 3:1 for large text.

Export tokens

:root {
  --text: #0C1A14;
  --secondary: #123524;
  --primary: #1F8A5B;
  --accent: #8FD3B0;
  --surface: #EEF6F1;
}

$ledger-green-text: #0C1A14;
$ledger-green-secondary: #123524;
$ledger-green-primary: #1F8A5B;
$ledger-green-accent: #8FD3B0;
$ledger-green-surface: #EEF6F1;

// tailwind.config.js — theme.extend.colors
colors: {
  'ledger-green': {
    'text': '#0C1A14',
    'secondary': '#123524',
    'primary': '#1F8A5B',
    'accent': '#8FD3B0',
    'surface': '#EEF6F1',
  },
}

{
    "ledger-green": {
        "text": {
            "value": "#0C1A14",
            "type": "color"
        },
        "secondary": {
            "value": "#123524",
            "type": "color"
        },
        "primary": {
            "value": "#1F8A5B",
            "type": "color"
        },
        "accent": {
            "value": "#8FD3B0",
            "type": "color"
        },
        "surface": {
            "value": "#EEF6F1",
            "type": "color"
        }
    }
}

{
    "text": "#0C1A14",
    "secondary": "#123524",
    "primary": "#1F8A5B",
    "accent": "#8FD3B0",
    "surface": "#EEF6F1"
}

/* Paste into Canva → Brand Kit → Brand Colors */
#0C1A14
#123524
#1F8A5B
#8FD3B0
#EEF6F1

Download for Procreate

How the roles work

SurfaceThe lightest color — page and card backgrounds.

TextThe darkest color — body text and high-contrast UI.

PrimaryThe most chromatic middle — buttons, links, the one color that pushes.

AccentThe second most chromatic — badges, highlights, states.

SecondaryEverything else — fills, borders, supporting surfaces.

Ledger Green

Contrast matrix

Export tokens

How the roles work

Related palettes