What Is Tokiwa Green? Its Pronunciation, Origin, and Color Swatches

Tokiwa green is a traditional Japanese color name pronounced tokiwa-iro (ときわいろ). It refers to a deep green associated with evergreen trees such as pines and cedars, which retain green foliage throughout the year. Although the references agree on its general character, their digital swatches vary. This article explains the reading and origin of the name, compares two HEX color samples, and shows how they could be used for headings, backgrounds, and buttons on a nature walk website.

Tokiwa-iro is a deep green named for evergreen foliage

The Japanese word tokiwa expresses the idea of remaining unchanged over time. It became associated with the deep green of evergreen trees such as pine and cedar. The name is written 常磐色, and the alternative spelling 常盤色 is also used; both are read tokiwa-iro. Explanations of the traditional color name connect its enduring green with wishes for longevity and prosperity.

A Japanese dictionary records an early use of the color name in the Kamakura-period poetry collection Shinsen Rokujō (新撰六帖). This shows that tokiwa green is an established historical color name rather than a modern term invented for web design. A Japanese color dictionary also describes the JIS conventional color name as “deep green.” However, the name does not specify exactly one universal HEX code for digital screens.

Compare two swatches and use them on a nature walk website

One online Japanese color reference lists tokiwa green as ■#007B43, corresponding to red 0, green 123, and blue 67 in RGB. RGB describes screen colors by the amounts of red, green, and blue light. Another traditional-color reference uses a darker sample, ■#006428, with red 0, green 100, and blue 40. Compared with the first swatch, it has lower green and blue component values. HEX is a six-digit hexadecimal notation used to specify colors on the web. Both codes are published examples, not competing claims to one universally definitive shade.

The contrast ratio between tokiwa green ■#007B43 and the darker sample ■#006428 is only about 1.37:1. A contrast ratio measures the difference in relative luminance between adjacent colors. Although their differences can be compared as swatches, do not use these two greens alone to distinguish selected and unselected states.

Example 1: Use tokiwa green behind the main heading. On a website for a local woodland tree-identification walk, make the opening banner tokiwa green ■#007B43 and display the headline and a short introduction in white ■#FFFFFF. The text-to-background contrast ratio is about 5.36:1. For longer explanations alongside photos of trees, switch to a warm paper-colored ■#F6F4EB background with dark ink-green ■#20352C body text. This combination gives approximately 11.86:1.

Example 2: Use the darker green for the registration button. In an information section with a warm paper background ■#F6F4EB, present the date and meeting place in ink-green ■#20352C. For a “Register for the Walk” button, use the darker tokiwa sample ■#006428 as the fill with white ■#FFFFFF lettering. The lettering and button contrast at about 7.36:1, while the button contrasts with the surrounding warm paper ■#F6F4EB at about 6.68:1. This gives the darker sample a clear role without relying on subtle differences between the two greens.

Check pale card boundaries and dark text on dark green

A white ■#FFFFFF card on a warm paper-colored ■#F6F4EB page has a contrast ratio of only about 1.10:1 against the surrounding area. If the card needs a distinct outline, a muted gray-green ■#61746B border contrasts about 4.52:1 against the outer paper background and 4.98:1 against the white interior. Very thin borders may still be difficult to notice, so review their width and spacing on the actual layout.

Dark ink-green ■#20352C text on the main tokiwa green ■#007B43 reaches only about 2.44:1. Instead of combining two dark shades for small lettering, use a brighter foreground such as white ■#FFFFFF and verify the specific pairing. Under Level AA of WCAG 2.2 (the Web Content Accessibility Guidelines), normal text generally requires at least 4.5:1 contrast, while qualifying large text requires 3:1. Important non-text cues, including some interactive control boundaries, may also need 3:1 against adjacent colors.

HueRoll lets you enter and adjust HEX colors and check the selected color’s contrast against white and black. It cannot compare arbitrary color pairs or automatically determine AA or AAA compliance. Verify the actual background, text, card, and button combinations separately before publishing.