W3C Design Tokens
3 filesCross-tool design-token spec (DTCG/W3C). Light + dark mode siblings.
Node.js
Node.js is the open-source, cross-platform JavaScript runtime built on V8 — the foundation of server-side JavaScript, modern build tooling, and a substantial fraction of the web's infrastructure. Stewarded today by the OpenJS Foundation, the brand voice is community-led and infrastructural: stable, long-term, ECMAScript-tracking. The visual identity is the hexagon mark in Node Green (#5FA04E post-2024 refresh), with the historic green (#339933) preserved for legacy surfaces.
1 palette 3 fonts 0 assets 9 rules
Preview prompt
Use the [email protected] brand from brand-atoms.com.
Fetch https://brand-atoms.com/dist/brands/nodejs/1.0.0/json/brand.json
and apply its role mappings (primary, accent, identity, etc.),
reference the fonts in references.fonts, and honor every rule where
severity is "error". Surface any deviation you choose to make.Downloads
All converter outputs for [email protected]. Served from
/dist/brands/nodejs/1.0.0/.
JSON
1 filePlain JSON mirror of the resolved brand — palette, fonts, roles, rules.
CSS variables
1 fileCSS custom properties on :root with prefers-color-scheme dark.
SCSS
1 fileSCSS variables + Sass maps for swatches, roles, and fonts.
Tailwind config
1 fileTailwind v3 theme.extend.colors + fontFamily.
Figma Tokens
1 fileFigma Tokens plugin JSON (Tokens Studio compatible).
Swift
1 fileSwift enums for SwiftUI / UIKit color + font tokens.
Kotlin / Compose
1 fileKotlin objects for Jetpack Compose color + typography tokens.
Markdown guide
1 fileHuman-readable brand guide. Same source as the on-page Brand Guide.
Brand Guide
Inline rendering of the Markdown brand guide. Same source as the
markdown/brand-guide.md download.
Node.js
Node.js is the open-source, cross-platform JavaScript runtime built on V8 — the foundation of server-side JavaScript, modern build tooling, and a substantial fraction of the web's infrastructure. Stewarded today by the OpenJS Foundation, the brand voice is community-led and infrastructural: stable, long-term, ECMAScript-tracking. The visual identity is the hexagon mark in Node Green (#5FA04E post-2024 refresh), with the historic green (#339933) preserved for legacy surfaces.
Tags: nodejs, javascript, runtime, server, green, open-source, openjs
Atoms
Palette
Node.js · [email protected] · MIT
Node.js brand palette anchored on Node Green (#5FA04E), the signature green of the hexagon mark following the 2024 brand refresh. The historic green (#339933) and Foundation-PDF Node Green (#68A063) are preserved as supporting tones. The full palette also includes Dark Green (#006837) and Light Green (#39B54A) from the original Node.js Foundation Visual Identity Guidelines, and a neutral set for light and dark canvases.
Fonts
| Role | Font | License | Classification |
|---|---|---|---|
heading |
Inter ([email protected]) |
OFL-1.1 | sans-serif |
body |
Inter ([email protected]) |
OFL-1.1 | sans-serif |
mono |
Source Code Pro ([email protected]) |
OFL-1.1 | monospace |
Swatches
| ID | Name | Value |
|---|---|---|
node-green |
Node Green | #5FA04E |
node-green-classic |
Node Green Classic | #339933 |
node-green-foundation |
Node Green Foundation | #68A063 |
node-dark-green |
Node Dark Green | #006837 |
node-light-green |
Node Light Green | #39B54A |
node-black |
Node Black | #000000 |
node-charcoal |
Node Charcoal | #1C1C1C |
node-gray |
Node Gray | #666666 |
node-light-gray |
Node Light Gray | #D5D5D5 |
node-off-white |
Node Off-White | #F4F4F4 |
node-white |
Node White | #FFFFFF |
Mode role mappings
Light mode
| Role | Swatch | Hex |
|---|---|---|
background |
node-white |
#FFFFFF |
surface |
node-off-white |
#F4F4F4 |
surface-elevated |
node-white |
#FFFFFF |
text-primary |
node-black |
#000000 |
text-secondary |
node-gray |
#666666 |
text-tertiary |
node-dark-green |
#006837 |
primary |
node-green |
#5FA04E |
primary-hover |
node-dark-green |
#006837 |
accent |
node-light-green |
#39B54A |
accent-hover |
node-green |
#5FA04E |
warning |
node-light-green |
#39B54A |
warning-hover |
node-green |
#5FA04E |
error |
node-dark-green |
#006837 |
success |
node-green |
#5FA04E |
Dark mode
| Role | Swatch | Hex |
|---|---|---|
background |
node-charcoal |
#1C1C1C |
surface |
node-black |
#000000 |
surface-elevated |
node-charcoal |
#1C1C1C |
text-primary |
node-white |
#FFFFFF |
text-secondary |
node-light-gray |
#D5D5D5 |
text-tertiary |
node-light-green |
#39B54A |
primary |
node-light-green |
#39B54A |
primary-hover |
node-green |
#5FA04E |
accent |
node-green |
#5FA04E |
accent-hover |
node-light-green |
#39B54A |
warning |
node-light-green |
#39B54A |
warning-hover |
node-green |
#5FA04E |
error |
node-dark-green |
#006837 |
success |
node-green |
#5FA04E |
Brand semantic roles
Colors
| Role | Swatch | Hex |
|---|---|---|
identity |
node-green |
#5FA04E |
on-identity |
node-white |
#FFFFFF |
primary |
node-green |
#5FA04E |
primary-hover |
node-dark-green |
#006837 |
accent |
node-light-green |
#39B54A |
accent-hover |
node-green |
#5FA04E |
background |
node-white |
#FFFFFF |
surface |
node-off-white |
#F4F4F4 |
text-primary |
node-black |
#000000 |
text-secondary |
node-gray |
#666666 |
Typography
| Role | Font role key |
|---|---|
display |
heading |
prose |
body |
code |
mono |
Rules
🛑 error (4)
forbiddenTreatment → logo
- treatments: hexagon-shape-modified, stretched, rotated, recolored, gradient-fill, drop-shadow, on-busy-photo
The Node.js hexagon mark is the brand's signature shape; altering its geometry, gradient-filling it, or recoloring it outside the documented green range violates the Foundation Visual Identity Guidelines.
contrastRatio → text-primary
- against:
background - minRatio:
4.5 - standard:
WCAG-AA
Black on White exceeds 21:1 — well above the WCAG AA threshold for body text. The Foundation Guidelines designate Black as the canonical body-text color on White.
accessibilityRequirement → *
- standard:
WCAG-AA - criterion:
1.4.3
WCAG 2.1 Success Criterion 1.4.3 (Contrast Minimum) — Level AA. Node.js's Foundation Guidelines pair Node Green with Black and White to satisfy AA; consumers must not derive intermediate stops that defeat that property.
contextRestriction → trademark.use
- forbiddenContexts: product-name-prefix, implied-endorsement
The OpenJS Foundation Trademark Policy forbids product names that imply OpenJS or Node.js endorsement. Use the mark to indicate compatibility, not as part of a product identity.
⚠️ warning (3)
colorChoice → roles.colors.identity
- allowed: node-green, node-green-classic, node-green-foundation
- forbidden: node-light-green, node-dark-green
Node.js maintains three legitimate "Node Green" values — the post-2024 refresh (#5FA04E), the historic mark (#339933), and the Foundation PDF (#68A063). Light Green and Dark Green are supporting tones from the Foundation Guidelines and must not stand in as the primary mark fill.
variantSelection → roles.colors.identity
- use:
node-green - when:
mode="current"
The current published Node.js mark (post-2024 refresh) uses #5FA04E. Choose this value for net-new surfaces; preserve #339933 only when matching legacy badges or community-distributed assets.
contrastRatio → roles.colors.primary
- against:
background - minRatio:
3 - standard:
WCAG-AA-large
Node Green (#5FA04E) on White sits around 3.4:1 — clears AA-large for headlines but does NOT clear AA for body text. Reserve Node Green for large display, mark fills, and accents; use Node Dark Green (#006837) for body-text-weight foreground.
💡 recommendation (2)
fontPairing → typography.heading
- requires:
body - minSizeRatio:
1.5
nodejs.org uses a single humanist sans for heading and body. Maintain at least a 1.5× heading-to-body ratio to preserve hierarchy.
compositionConstraint → roles.colors.identity
- pairsWith: node-black, node-white, node-dark-green
The Foundation Guidelines pair Node Green canonically with Black and White; Dark Green appears for shadowed mark variants. Other pairings depart from the documented identity.
Provenance
- Source: https://nodejs.org/static/documents/foundation-visual-guidelines.pdf
- License:
MIT - Attribution: Node.js is MIT-licensed and stewarded by the OpenJS Foundation. The Node.js hexagon mark and word mark are trademarks of the OpenJS Foundation. Brand colors documented here are drawn from the Node.js Foundation Visual Identity Guidelines PDF (nodejs.org/static/documents/ foundation-visual-guidelines.pdf) and supplemented by the post-2024 refresh Node Green (#5FA04E) used on the current nodejs.org logo and verified against the simple-icons project. This atom is brand-atoms' machine-readable encoding; no logos are bundled.
- Imported:
2026-05-18 - Notes: The Foundation Visual Identity Guidelines PDF publishes Node Green at #68A063 (PANTONE 7741 C). The current nodejs.org logo uses a refreshed Node Green at #5FA04E. Both values appear in this atom's palette; #5FA04E is the primary role mapping per the current published mark. Typography in the original guidelines is "Open Sans equivalent" — Open Sans is not in the brand-atoms catalog; this atom uses Inter as the catalog-equivalent humanist sans.
Generated by the brand-atoms converter. Source: [email protected] from the encyclopedia.
Components — same template, themed by Node.js
Every block below renders from the resolved palette + font references on this brand. Swap the brand and the same template re-themes — no per-brand component code required.
Node.js
A clear hierarchy in Node.js's typeface
Tertiary heading — supporting structure
Body copy renders in the brand's prose font on the brand's background.
Inline links and highlighted phrases pick up
the brand's primary and highlight roles. Code spans like brand.references.palette
fall back to the monospace face.
A blockquote uses the brand's accent color as its rule. Useful for pulling tagline copy out of running prose.
Bulleted list
- Bullet markers inherit the brand's primary color.
- Item spacing reads as a deliberate vertical rhythm.
- Nested items still resolve to the same primary.
- Second-level item using the accent.
- Third bullet wraps cleanly at narrow widths.
Numbered list
- Open the brand's resolved spec.
- Apply roles to the component template.
- Render the surface in the brand's identity.
- Audit the output against the typed rules.
Callout boxes
Info
Neutral status — provides supplemental context without urgency. Uses the brand's primary as the rule.
Success
Confirms a completed action — palette role success determines the rule color.
Warning
Calls out something that needs attention but isn't an error — palette role warning.
Error
Surfaces a failure that blocks progress — palette role error. Use sparingly.
Table
| Role | Resolves to | Mode |
|---|---|---|
| primary | brand color #1 | light + dark |
| accent | brand color #2 | light + dark |
| warning | brand warning | light + dark |
| error | brand error | light + dark |
Atoms
Brand semantic roles
Brand-level role overrides on top of palette-default mappings. Each role resolves to a concrete swatch or font reference.
Colors
accent
→ node-light-green #39B54A accent-hover
→ node-green #5FA04E background
→ node-white #FFFFFF identity
→ node-green #5FA04E on-identity
→ node-white #FFFFFF primary
→ node-green #5FA04E primary-hover
→ node-dark-green #006837 surface
→ node-off-white #F4F4F4 text-primary
→ node-black #000000 text-secondary
→ node-gray #666666 Typography
code
→ mono Source Code Pro display
→ heading Inter prose
→ body Inter Palette mode mappings (from nodejs)
Light mode (14 roles)
accent
→ node-light-green accent-hover
→ node-green background
→ node-white error
→ node-dark-green primary
→ node-green primary-hover
→ node-dark-green success
→ node-green surface
→ node-off-white surface-elevated
→ node-white text-primary
→ node-black text-secondary
→ node-gray text-tertiary
→ node-dark-green warning
→ node-light-green warning-hover
→ node-green Dark mode (14 roles)
accent
→ node-green accent-hover
→ node-light-green background
→ node-charcoal error
→ node-dark-green primary
→ node-light-green primary-hover
→ node-green success
→ node-green surface
→ node-black surface-elevated
→ node-charcoal text-primary
→ node-white text-secondary
→ node-light-gray text-tertiary
→ node-light-green warning
→ node-light-green warning-hover
→ node-green Rules (9 typed constraints)
error · 4 rules
forbiddenTreatment logo treatments hexagon-shape-modified, stretched, rotated, recolored, gradient-fill, drop-shadow, on-busy-photo The Node.js hexagon mark is the brand's signature shape; altering its geometry, gradient-filling it, or recoloring it outside the documented green range violates the Foundation Visual Identity Guidelines.
contrastRatio text-primary against background minRatio 4.5 standard WCAG-AA Black on White exceeds 21:1 — well above the WCAG AA threshold for body text. The Foundation Guidelines designate Black as the canonical body-text color on White.
accessibilityRequirement * standard WCAG-AA criterion 1.4.3 WCAG 2.1 Success Criterion 1.4.3 (Contrast Minimum) — Level AA. Node.js's Foundation Guidelines pair Node Green with Black and White to satisfy AA; consumers must not derive intermediate stops that defeat that property.
contextRestriction trademark.use forbiddenContexts product-name-prefix, implied-endorsement The OpenJS Foundation Trademark Policy forbids product names that imply OpenJS or Node.js endorsement. Use the mark to indicate compatibility, not as part of a product identity.
warning · 3 rules
colorChoice roles.colors.identity allowed node-green, node-green-classic, node-green-foundation forbidden node-light-green, node-dark-green Node.js maintains three legitimate "Node Green" values — the post-2024 refresh (#5FA04E), the historic mark (#339933), and the Foundation PDF (#68A063). Light Green and Dark Green are supporting tones from the Foundation Guidelines and must not stand in as the primary mark fill.
variantSelection roles.colors.identity use node-green when mode="current" The current published Node.js mark (post-2024 refresh) uses #5FA04E. Choose this value for net-new surfaces; preserve #339933 only when matching legacy badges or community-distributed assets.
contrastRatio roles.colors.primary against background minRatio 3 standard WCAG-AA-large Node Green (#5FA04E) on White sits around 3.4:1 — clears AA-large for headlines but does NOT clear AA for body text. Reserve Node Green for large display, mark fills, and accents; use Node Dark Green (#006837) for body-text-weight foreground.
recommendation · 2 rules
fontPairing typography.heading requires body minSizeRatio 1.5 nodejs.org uses a single humanist sans for heading and body. Maintain at least a 1.5× heading-to-body ratio to preserve hierarchy.
compositionConstraint roles.colors.identity pairsWith node-black, node-white, node-dark-green The Foundation Guidelines pair Node Green canonically with Black and White; Dark Green appears for shadowed mark variants. Other pairings depart from the documented identity.
Provenance
- Source
- https://nodejs.org/static/documents/foundation-visual-guidelines.pdf
- License
MIT- Attribution
- Node.js is MIT-licensed and stewarded by the OpenJS Foundation. The Node.js hexagon mark and word mark are trademarks of the OpenJS Foundation. Brand colors documented here are drawn from the Node.js Foundation Visual Identity Guidelines PDF (nodejs.org/static/documents/ foundation-visual-guidelines.pdf) and supplemented by the post-2024 refresh Node Green (#5FA04E) used on the current nodejs.org logo and verified against the simple-icons project. This atom is brand-atoms' machine-readable encoding; no logos are bundled.
- Imported
2026-05-18- Notes
- The Foundation Visual Identity Guidelines PDF publishes Node Green at #68A063 (PANTONE 7741 C). The current nodejs.org logo uses a refreshed Node Green at #5FA04E. Both values appear in this atom's palette; #5FA04E is the primary role mapping per the current published mark. Typography in the original guidelines is "Open Sans equivalent" — Open Sans is not in the brand-atoms catalog; this atom uses Inter as the catalog-equivalent humanist sans.