JavaScript String fontcolor() Method

Beginner
5 min read
Updated: Nov 2026
3 examples
Method
Decorative image with the word FONTCOLOR

Definition

String.prototype.fontcolor(color) returns an HTML string that wraps your text in a <font color="..."> tag. It is a deprecated HTML wrapper (legacy only) and does not create a live DOM node.

Pass the required arguments shown below. Check return values and browser support before you rely on the result.

Syntax

Call string.fontcolor. Start with this line.

JavaScript
str.fontcolor(color)
CallWhat it does
str.fontcolor(color)Primary signature.
string.fontcolor(...)Call with the arguments your case needs.

Built into JavaScript. Call fontcolor(...) on a string (or String instance) — no import required.

Library declarations
JavaScript
str.fontcolor(color)

Parameters

ParameterDescription
colorRequired. Attribute value (coerced to string; not validated)

Return Value

Return ValueDescription
*HTML string with <font color>

JavaScript Examples

Example 1 — Named Color

Wrap text with a CSS color name and log the HTML string.

JavaScript
const text = "Hello, world";

console.log(text.fontcolor("red"));
// '<font color="red">Hello, world</font>'

console.log(text);  // "Hello, world" (unchanged)
Try It Yourself

How It Works

  1. Start with text. text holds "Hello, world".
  2. Call the wrapper. fontcolor("red") builds opening tag + text + closing tag.
  3. Get a string. The return value is markup text, not a painted element.
  4. Original stays put. Strings are immutable — text is still "Hello, world".

Example 2 — Hex RGB Triplet

Pass rrggbb without a leading # (legacy convention for this API).

JavaScript
// Salmon: red=FA, green=80, blue=72
console.log("Hello".fontcolor("FA8072"));
// '<font color="FA8072">Hello</font>'

console.log("Hello".fontcolor("ff00dd"));
// '<font color="ff00dd">Hello</font>'
Try It Yourself

How It Works

  1. Skip the hash. This API expects "FA8072", not "#FA8072".
  2. No validation. The method pastes the value into the attribute as-is.
  3. Same shape every time. Opening <font color="...">, text, then </font>.
  4. Modern CSS differs. In CSS you would write #FA8072 or rgb(...) on style.color.

Example 3 — Modern CSS color

Style a real element instead of building obsolete <font> markup.

JavaScript
const el = document.createElement("p");
el.textContent = "Hello, world";
el.style.color = "red";

console.log(el.style.color);  // "red"
console.log(el.outerHTML);    // '<p style="color: red;">Hello, world</p>'

// Hex works the modern way too:
el.style.color = "#FA8072";
Try It Yourself

How It Works

  1. Create a real node. createElement("p") gives you a live element.
  2. Set safe text. textContent avoids HTML injection risks from string-built tags.
  3. Apply CSS. style.color = "red" is valid and themeable.
  4. Prefer classes in apps. A CSS class or design token scales better than inline styles.
Compatibility

Browser & Runtime Support

String.prototype.fontcolor() is still widely implemented for compatibility, but it is deprecated. Do not use it in new projects.

✓ Deprecated · Legacy

String.fontcolor()

Available in modern browsers for old code. MDN recommends CSS color instead of building <font> tags.

Legacy Compatibility only
Google Chrome Supported · Desktop & Mobile
Full support
Mozilla Firefox Supported · Desktop & Mobile
Full support
Apple Safari Supported · macOS & iOS
Full support
Microsoft Edge Supported · Chromium
Full support
Internet Explorer No native support · Use a polyfill
Polyfill
Opera Supported · Modern versions
Full support
Samsung Internet Supported · Android
Full support
Bun Supported · JavaScript runtime
Supported
Deno Supported · JavaScript runtime
Supported
Node.js Supported · Server runtime
Supported
Android WebView Supported · Modern WebView
Full support
fontcolor() Avoid in new code

Bottom line: Recognize fontcolor() in legacy samples. For new UI, control text color with CSS color — never rely on the obsolete <font> element from HTML wrapper methods.

Frequently Asked Questions

fontcolor(color) returns an HTML string that wraps the text in a <font color="..."> tag. For example, "Hello".fontcolor("red") returns '<font color="red">Hello</font>'.
Yes. MDN marks all HTML wrapper methods as deprecated. The <font> element itself was removed from the HTML specification. Prefer CSS color instead.
A CSS color name (like "red") or a hexadecimal RGB triplet without # (like "FA8072" for salmon). The method does not validate the value — it just puts it in the attribute.
No. Strings are immutable. fontcolor() returns a new string containing HTML markup. The original text stays the same.
Double quotes in color are escaped as &quot; so the generated attribute stays well-formed as HTML text.
Set CSS color on an element, for example element.style.color = "red", or use a CSS class / custom property. Do not build <font> tags with string methods.

Next: fontsize()

See the matching deprecated size wrapper — and why CSS font-size replaced it.

fontsize() tutorial →

About the author

Mari Selvan M P
Mari Selvan M P 🔗

Developer, cloud engineer, and technical writer

  • Experience 12 years building web and cloud systems
  • Focus Full Stack Development, AWS, and Developer Education

I write practical tutorials so students and working developers can learn by doing—from databases and APIs to deployment on AWS.

AWS Certified Developer – Associate (Credly)

9 people found this page helpful

JavaScript String fixed() Method JavaScript String fontsize() Method