boy emoji
boy-light-skin-tone from Emoji One (Colored) by Emoji One · Light skin tone · People · CC-BY-4.0 Attribution required.
- Name
- boy-light-skin-tone
- Set
- Emoji One (Colored)
- Style
- Light skin tone
- Category
- People
- Viewbox
- 64×64
- License
- CC BY 4.0
5 other variants in Emoji One (Colored)
The same emoji in other sets
More people icons from Emoji One (Colored)
alienalien-monsterangry-faceangry-face-with-hornsanguished-faceanxious-face-with-sweatastonished-facebabybaby-angelbackhand-index-pointing-downbackhand-index-pointing-leftbackhand-index-pointing-rightbackhand-index-pointing-upbeaming-face-with-smiling-eyesblond-haired-personbride-with-veilbriefcasebust-in-silhouettebusts-in-silhouettecall-me-handcat-face-with-tears-of-joycat-face-with-wry-smileclapping-handsclosed-umbrella
Use the boy emoji
SVG
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 64 64"><path fill="#594640" d="M32 2c23 0 28 15.3 28 24c0 7.7-1 11-1 11H5s-1-3.3-1-11C4 17.3 9 2 32 2"/><path fill="#ffe1bd" d="M57.2 33s-.8-3.3-1.2-10.2c-.5-7.5-10.9-1.5-24-1.5s-23.5-6-24 1.5C7.6 29.7 6.8 33 6.8 33c-6.5 0-6.5 10.6.4 10.6C7.2 55 21.5 62 32 62s24.8-7 24.8-18.4c6.9 0 6.9-10.6.4-10.6"/><circle cx="44.5" cy="35.5" r="6.5" fill="#fff"/><circle cx="44.5" cy="35.5" r="4.5" fill="#664e27"/><circle cx="44.5" cy="35.5" r="1.5" fill="#231f20"/><circle cx="19.5" cy="35.5" r="6.5" fill="#fff"/><circle cx="19.5" cy="35.5" r="4.5" fill="#664e27"/><circle cx="19.5" cy="35.5" r="1.5" fill="#231f20"/><path fill="#664e27" d="M40.1 48.1c-5.2 3.6-11 3.6-16.2 0c-.6-.4-1.2.3-.8 1c1.6 2.6 4.8 4.9 8.9 4.9s7.3-2.3 8.9-4.9c.4-.7-.2-1.4-.8-1"/></svg>
React
import type { SVGProps } from "react";
export function EmojioneBoyLightSkinTone(props: SVGProps<SVGSVGElement>) {
return (
<svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 64 64"><path fill="#594640" d="M32 2c23 0 28 15.3 28 24c0 7.7-1 11-1 11H5s-1-3.3-1-11C4 17.3 9 2 32 2"/><path fill="#ffe1bd" d="M57.2 33s-.8-3.3-1.2-10.2c-.5-7.5-10.9-1.5-24-1.5s-23.5-6-24 1.5C7.6 29.7 6.8 33 6.8 33c-6.5 0-6.5 10.6.4 10.6C7.2 55 21.5 62 32 62s24.8-7 24.8-18.4c6.9 0 6.9-10.6.4-10.6"/><circle cx="44.5" cy="35.5" r="6.5" fill="#fff"/><circle cx="44.5" cy="35.5" r="4.5" fill="#664e27"/><circle cx="44.5" cy="35.5" r="1.5" fill="#231f20"/><circle cx="19.5" cy="35.5" r="6.5" fill="#fff"/><circle cx="19.5" cy="35.5" r="4.5" fill="#664e27"/><circle cx="19.5" cy="35.5" r="1.5" fill="#231f20"/><path fill="#664e27" d="M40.1 48.1c-5.2 3.6-11 3.6-16.2 0c-.6-.4-1.2.3-.8 1c1.6 2.6 4.8 4.9 8.9 4.9s7.3-2.3 8.9-4.9c.4-.7-.2-1.4-.8-1"/></svg>
);
}
Vue
<template> <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 64 64"><path fill="#594640" d="M32 2c23 0 28 15.3 28 24c0 7.7-1 11-1 11H5s-1-3.3-1-11C4 17.3 9 2 32 2"/><path fill="#ffe1bd" d="M57.2 33s-.8-3.3-1.2-10.2c-.5-7.5-10.9-1.5-24-1.5s-23.5-6-24 1.5C7.6 29.7 6.8 33 6.8 33c-6.5 0-6.5 10.6.4 10.6C7.2 55 21.5 62 32 62s24.8-7 24.8-18.4c6.9 0 6.9-10.6.4-10.6"/><circle cx="44.5" cy="35.5" r="6.5" fill="#fff"/><circle cx="44.5" cy="35.5" r="4.5" fill="#664e27"/><circle cx="44.5" cy="35.5" r="1.5" fill="#231f20"/><circle cx="19.5" cy="35.5" r="6.5" fill="#fff"/><circle cx="19.5" cy="35.5" r="4.5" fill="#664e27"/><circle cx="19.5" cy="35.5" r="1.5" fill="#231f20"/><path fill="#664e27" d="M40.1 48.1c-5.2 3.6-11 3.6-16.2 0c-.6-.4-1.2.3-.8 1c1.6 2.6 4.8 4.9 8.9 4.9s7.3-2.3 8.9-4.9c.4-.7-.2-1.4-.8-1"/></svg> </template>
CSS
.icon-boy-light-skin-tone {
width: 24px;
height: 24px;
background-color: currentColor;
-webkit-mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%221em%22%20height%3D%221em%22%20viewBox%3D%220%200%2064%2064%22%3E%3Cpath%20fill%3D%22%23594640%22%20d%3D%22M32%202c23%200%2028%2015.3%2028%2024c0%207.7-1%2011-1%2011H5s-1-3.3-1-11C4%2017.3%209%202%2032%202%22%2F%3E%3Cpath%20fill%3D%22%23ffe1bd%22%20d%3D%22M57.2%2033s-.8-3.3-1.2-10.2c-.5-7.5-10.9-1.5-24-1.5s-23.5-6-24%201.5C7.6%2029.7%206.8%2033%206.8%2033c-6.5%200-6.5%2010.6.4%2010.6C7.2%2055%2021.5%2062%2032%2062s24.8-7%2024.8-18.4c6.9%200%206.9-10.6.4-10.6%22%2F%3E%3Ccircle%20cx%3D%2244.5%22%20cy%3D%2235.5%22%20r%3D%226.5%22%20fill%3D%22%23fff%22%2F%3E%3Ccircle%20cx%3D%2244.5%22%20cy%3D%2235.5%22%20r%3D%224.5%22%20fill%3D%22%23664e27%22%2F%3E%3Ccircle%20cx%3D%2244.5%22%20cy%3D%2235.5%22%20r%3D%221.5%22%20fill%3D%22%23231f20%22%2F%3E%3Ccircle%20cx%3D%2219.5%22%20cy%3D%2235.5%22%20r%3D%226.5%22%20fill%3D%22%23fff%22%2F%3E%3Ccircle%20cx%3D%2219.5%22%20cy%3D%2235.5%22%20r%3D%224.5%22%20fill%3D%22%23664e27%22%2F%3E%3Ccircle%20cx%3D%2219.5%22%20cy%3D%2235.5%22%20r%3D%221.5%22%20fill%3D%22%23231f20%22%2F%3E%3Cpath%20fill%3D%22%23664e27%22%20d%3D%22M40.1%2048.1c-5.2%203.6-11%203.6-16.2%200c-.6-.4-1.2.3-.8%201c1.6%202.6%204.8%204.9%208.9%204.9s7.3-2.3%208.9-4.9c.4-.7-.2-1.4-.8-1%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%221em%22%20height%3D%221em%22%20viewBox%3D%220%200%2064%2064%22%3E%3Cpath%20fill%3D%22%23594640%22%20d%3D%22M32%202c23%200%2028%2015.3%2028%2024c0%207.7-1%2011-1%2011H5s-1-3.3-1-11C4%2017.3%209%202%2032%202%22%2F%3E%3Cpath%20fill%3D%22%23ffe1bd%22%20d%3D%22M57.2%2033s-.8-3.3-1.2-10.2c-.5-7.5-10.9-1.5-24-1.5s-23.5-6-24%201.5C7.6%2029.7%206.8%2033%206.8%2033c-6.5%200-6.5%2010.6.4%2010.6C7.2%2055%2021.5%2062%2032%2062s24.8-7%2024.8-18.4c6.9%200%206.9-10.6.4-10.6%22%2F%3E%3Ccircle%20cx%3D%2244.5%22%20cy%3D%2235.5%22%20r%3D%226.5%22%20fill%3D%22%23fff%22%2F%3E%3Ccircle%20cx%3D%2244.5%22%20cy%3D%2235.5%22%20r%3D%224.5%22%20fill%3D%22%23664e27%22%2F%3E%3Ccircle%20cx%3D%2244.5%22%20cy%3D%2235.5%22%20r%3D%221.5%22%20fill%3D%22%23231f20%22%2F%3E%3Ccircle%20cx%3D%2219.5%22%20cy%3D%2235.5%22%20r%3D%226.5%22%20fill%3D%22%23fff%22%2F%3E%3Ccircle%20cx%3D%2219.5%22%20cy%3D%2235.5%22%20r%3D%224.5%22%20fill%3D%22%23664e27%22%2F%3E%3Ccircle%20cx%3D%2219.5%22%20cy%3D%2235.5%22%20r%3D%221.5%22%20fill%3D%22%23231f20%22%2F%3E%3Cpath%20fill%3D%22%23664e27%22%20d%3D%22M40.1%2048.1c-5.2%203.6-11%203.6-16.2%200c-.6-.4-1.2.3-.8%201c1.6%202.6%204.8%204.9%208.9%204.9s7.3-2.3%208.9-4.9c.4-.7-.2-1.4-.8-1%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/emojione/boy-light-skin-tone.svg?color=%231a73e8&size=48
