Use an emoji when the heart icon is a tone in a title, and a UI icon when it is a control. Emoji carry their own color and a CC-BY credit on the emoji set; a monochrome 30 px icon recolors with the type. Search finds the UI mark, and the emoji index finds the picture character.
Put an emoji beside a friendly headline. Put the heart icon UI icon on a button, a toolbar, or a 30 px legend where the stroke must match the type. Do not mix both in the same control row: the emoji will not recolor and the icon will look unfinished next to it.
Check each criteria to confirm findings against the atlas verdict.
A title, a section break, or a chat example can use the picture character in place of a heart icon. Readers already know the color. You still owe the emoji set’s CC-BY line if that character is the one from this library, not a system font glyph.
A button, a form label, or a 30 px legend needs the heart icon as a stroke icon. It stays one weight with its neighbors and survives a dark slide without a colored blob.
The emoji pictures in this library are CC-BY. Many UI packs that hold a heart icon are MIT or ISC. Swapping the picture for the icon at 30 px also swaps the credit duty. Check the badge before you publish.
If the row already has three stroke icons, do not drop an emoji in the fourth seat as the heart icon. The 30 px heights will not match, and the color will shout over the line work.
This page chooses between an emoji and a UI heart icon at 30 px. It does not invent a new pictogram or drop the CC-BY line on the emoji set.
Browse emoji · Open icon search
How do you search for the check mark when the slide only needs 24 px? · When do you pick MIT instead of CC-BY for the warning triangle? · How does a PowerPoint insert of the house icon differ from copying the SVG? · When is an emoji the wrong stand-in for the user icon? · Should you search the calendar icon by tag or by name? · When should the credits page, not the tile badge, decide the lock icon? · 50 icon search and licence decisions