Color NCol
Natural Color System notation explained
What Is NCol?
NCol (Natural Color) is a color notation system that describes colors in a way that feels natural to humans. Instead of abstract numbers, NCol uses six named primary hues — Red, Yellow, Green, Cyan, Blue, and Magenta — as starting points.
The format is: <Letter><Offset>, <Whiteness>%, <Blackness>%. For example, R0, 0%, 0% is pure red, while R30, 20%, 10% is red shifted 30° toward yellow, with 20% white and 10% black mixed in.
The Six Primary Hues
Understanding the NCol Format
NCol breaks the 360° hue wheel into six equal 60° segments, each named after a primary color:
| Letter | Color | Hue Range | Example |
|---|---|---|---|
| R | Red | 0°–59° | R0 = pure red, R30 = orange-red |
| Y | Yellow | 60°–119° | Y0 = pure yellow, Y30 = yellow-green |
| G | Green | 120°–179° | G0 = pure green, G30 = teal-green |
| C | Cyan | 180°–239° | C0 = pure cyan, C30 = ocean blue |
| B | Blue | 240°–299° | B0 = pure blue, B30 = violet |
| M | Magenta | 300°–359° | M0 = pure magenta, M30 = pink-magenta |
NCol Reference Table
Common colors and their NCol notation:
| Color | Swatch | HEX | NCol |
|---|---|---|---|
| Pure Red | #FF0000 | R0, 0%, 0% | |
| Orange | #FF8800 | R32, 0%, 0% | |
| Pure Yellow | #FFFF00 | Y0, 0%, 0% | |
| Lime | #88FF00 | Y28, 0%, 0% | |
| Pure Green | #00FF00 | G0, 0%, 0% | |
| Spring | #00FF88 | G32, 0%, 0% | |
| Pure Cyan | #00FFFF | C0, 0%, 0% | |
| Sky Blue | #0088FF | C28, 0%, 0% | |
| Pure Blue | #0000FF | B0, 0%, 0% | |
| Violet | #8800FF | B32, 0%, 0% | |
| Pure Magenta | #FF00FF | M0, 0%, 0% | |
| Rose | #FF0088 | M28, 0%, 0% | |
| White | #FFFFFF | R0, 100%, 0% | |
| Light Gray | #C0C0C0 | R0, 75%, 25% | |
| Dark Gray | #404040 | R0, 25%, 75% | |
| Black | #000000 | R0, 0%, 100% |
Try It — Convert Any Color to NCol
C37, 26%, 4%66, 133, 244217°, 89%, 61%217° 26% 4%NCol vs. Other Color Models
| Feature | NCol | HSL | HWB |
|---|---|---|---|
| Hue representation | Letter + offset (R30) | Degrees (30°) | Degrees (30°) |
| Tint control | Whiteness % | Lightness % | Whiteness % |
| Shade control | Blackness % | Lightness % | Blackness % |
| CSS native | No | Yes | Yes (Level 4) |
| Readability | Most natural | Good | Good |
How to Use Color NCol?
- 1Choose a base color using the interactive picker or enter HEX, RGB, HSL values.
- 2Generate matching color palettes, schemes, or color space transformations instantly.
- 3Click on any color code block in the results to copy it instantly to your clipboard.
Designer Friendly
Easily match colors, check contrast ratios, and generate custom palettes for your designs.
Multi-Format Support
Supports copy-paste in HEX, RGB, RGBA, HSL, HSLA, and CSS variables formats.
Runs Locally
No internet connection required. Our color engines run instantly and cleanly inside your web browser.