javascriptunicodeemoji

How do I apply a skin tone to an emoji in JavaScript?

Given this emoji, how can I programmatically apply a skin tone in JavaScript?

Grinning face is 0x1F600.

Dark Skin Tone is 0x1F3FF.

Do I simply concatenate the values together?

The following code, based on the algorithm here, merely prints two characters out.

function units(codepoint) {
    const tmp = codepoint - 0x10000
    const padded = tmp.toString(2).padStart(20, '0')
    const unit1 = Number.parseInt(padded.substr(0, 10), 2) + 0xD800;
    const unit2 = Number.parseInt(padded.substr(10), 2) + 0xDC00;
    return [unit1, unit2]
}

const face = units(0x1F600)
const tone = units(0x1F3FF)
const ch = String.fromCharCode(...face, ...tone) 
console.log(ch) // 😀🏿

Solution

  • There are only few emojis that actually take up Skin Tones. For example, faces - man and women facepalming:

    function units(codepoint) {
    const tmp = codepoint - 0x10000
    const padded = tmp.toString(2).padStart(20, '0')
    const unit1 = Number.parseInt(padded.substr(0, 10), 2) + 0xD800;
    const unit2 = Number.parseInt(padded.substr(10), 2) + 0xDC00;
    return [unit1, unit2]
}

const face = units(0x1F926)
const tone = units(0x1F3FF)
const ch = String.fromCharCode(...face, ...tone) 
console.log(ch)

    It's not possible with others that do not support colour variants. Here, in Every Emoji by Codepoint, you can find those support the Emoji Modifier Fitzpatrick.

    No Modifier Support

    nomod

    Modifier Supported

    yesmod