Skip to lesson content

Add and recolor icons

Last updated: September 8, 2026 · 1 min read

Choose a library icon and adjust its size and palette.

You edit the icon’s existing color slots; icons do not all have the same number of editable colors.

Follow these steps

  1. 1

    Insert an icon

    EditorElements > Icons

    Open Icons within Elements. Find an icon using search or categories and click it to insert. Position and select it on the page.

  2. 2

    Resize the icon

    PropertiesScale

    Use the scale slider or percentage field, from 25–300%. This changes the block’s dimensions while preserving aspect ratio and center. The panel also reflects resizing from canvas corners.

  3. 3

    Edit palette slots

    PropertiesColor Palette

    Choose a new color for each palette slot. A row reset restores that color; the section reset restores all changed slots. An empty palette means this icon has no editable color slots.

  4. 4

    Preserve meaning

    PropertiesAccessibility

    If the icon conveys information by itself, provide its accessible description. If it only decorates nearby text, make the decorative decision accordingly. Use consistent size and color for icons with the same meaning.

Check your result

Check the result in preview, then verify the reader experience in the published version.