Islamic Green

HEX: #009000 | Modern Palette

On White
4.21:1
FAIL
On Black
4.99:1
PASS

Color Specifications

HEX
#009000
RGB
0, 144, 0
HSL
120°, 100% ,56%
CMYK
100, 0, 100, 43.53

About Islamic Green

Islamic Green (#009000) is a color with RGB(0, 144, 0) and HSL(120°, 100%, 56.47%). It is commonly associated with Bold moods. In design, it fits Vivid, Neon styles and is suitable for Text, Button, Accent. Its complementary color is #900090, which creates strong contrast. Its triadic palette includes #000090 and #900000. The name comes from أخضر (akhḍar) (Arabic).

  • HEX: #009000
  • RGB: 0, 144, 0
  • HSL: 120°, 100%, 56.47%
  • Mood: Bold
  • Style: Vivid, Neon
  • Use case: Text, Button, Accent
  • Complementary color: #900090
  • Triadic colors: #000090, #900000
  • The name comes from أخضر (akhḍar) (Arabic).

Live Components

LIGHT
DARK
System Notification Box

Color Palettes

Monochromatic Five tones of the same hue — a reliable scale for backgrounds, surfaces, and text.
Neutral + Accent Four near-neutral tones grounded by a saturated accent — clean and versatile for UI.
Analogous Five hues drifting across a 60° arc — naturally harmonious and pleasing to the eye.
3 + 1 + 1 Three analogous base colors, one complementary accent, one dark anchor — bold yet balanced.

Color Harmonies

Complementary

The color directly opposite on the color wheel — creates maximum contrast and vibrance.

Analogous

Colors adjacent on the wheel — naturally harmonious and pleasing to the eye.

Triadic

Three colors equally spaced 120° apart — bold, balanced, and visually rich.

Split-Complementary

Two colors flanking the complement — high contrast with less tension than full complementary.

Tetradic (Square)

Four colors at 90° intervals — rich variety, best when one color dominates.

Monochromatic

Shades and tints of the same hue — cohesive, elegant, and easy to work with.

Shades & Tints

A seamless scale of #009000 from deepest shade to lightest tint.

Color Characteristics

Mood
Bold
Style
Vivid Neon
Use case
Text Button Accent

Accessibility Simulation

Deuteranopia #7B7B12
Protanopia #898900
Tritanopia #368787
Achromatopsia #7B7B7B

Frequently Asked Questions

Islamic Green (#009000) is a color with RGB(0, 144, 0) and HSL(120°, 100%, 56.47%).

#009000 pairs strongly with #900090 as its complementary color. It can also be used with neutral tones for balanced UI and design layouts.

#009000 is suitable for Text, Button, Accent and works well with Vivid, Neon styles.

#009000 is commonly associated with Bold.

The name Islamic Green is linked to أخضر (akhḍar) from Arabic, meaning green.

Name, History & Etymology

Origin Word أخضر (akhḍar)
Meaning green
Language Arabic
First Recorded Use 7th Century CE

History

Green holds a prominent and revered position in Islam. It is mentioned in the Quran as the color of the garments of the inhabitants of Paradise (e.g., Surah Al-Kahf 18:31, Surah Ar-Rahman 55:76). The Prophet Muhammad is reported to have worn green and favored the color. Historically, green banners were used by various Islamic caliphates and dynasties, most notably the Fatimid Caliphate. It symbolizes nature, life, fertility, and paradise. Over centuries, it became strongly associated with the religion itself, appearing in flags of many Muslim-majority countries, mosque decorations, and religious texts.

First Recorded Use

The association of green with Islam dates back to the time of Prophet Muhammad. While a specific 'Islamic Green' hex code wasn't defined, the color green was frequently mentioned and used.

Cultural Associations

Symbolizes paradise, nature, and life in the Quran. Associated with the Prophet Muhammad, who reportedly favored the color. Used in the flags of many Islamic nations (e.g., Saudi Arabia, Pakistan, Algeria, Iran). Commonly used in mosque architecture, calligraphy, and religious artifacts. Represents peace, prosperity, and hope within Islamic culture.

Similar Named Colors

India Green #138808 ΔE 2.85
Forest Green #228B22 ΔE 3.03
North Texas Green #059033 ΔE 4.69
Office Green #008000 ΔE 5.72

Code Snippets

/* Background */
.element {
    background-color: #009000;
}

/* Text */
.element {
    color: #009000;
}

/* Border */
.element {
    border: 1px solid #009000;
}

/* Linear gradient to complementary */
.element {
    background: linear-gradient(
        to right,
        #009000,
        #FF21FF
    );
}

/* Radial gradient */
.element {
    background: radial-gradient(
        circle,
        #009000,
        #FF21FF
    );
}

// SCSS variable
$islamic-green: #009000;

// With RGB channels (useful for rgba() usage)
$islamic-green-r: 0;
$islamic-green-g: 144;
$islamic-green-b: 0;

// Usage
.element {
    background-color: $islamic-green;
    color: rgba($islamic-green-r, $islamic-green-g, $islamic-green-b, 0.8);
}