List of icons in Obsidian

List of icons.md

/**
 * List all icons available to `obsidian.setIcon()`
 * 
 * @author Ljavuras <[email protected]>
 */

dv.container.createEl("style", { attr: { scope: "" }, text: `
.icon-table {
    display: flex;
    flex-wrap: wrap;
    margin: 0 var(--size-4-6);
}

.icon-item {
    padding: var(--size-4-2);
    line-height: 0;
    cursor: pointer;
}

.icon-item:hover {
    background-color: var(--background-modifier-active-hover);
    border-radius: var(--radius-s);
}
`});

function renderIconTable(ids) {
    const tableEl = dv.container.createDiv("icon-table");
    ids.forEach((id) => {
        let iconEl = tableEl.createDiv("icon-item");
        obsidian.setIcon(iconEl, id);
        obsidian.setTooltip(iconEl, id, { delay: 0 });
        iconEl.onclick = () => {
            navigator.clipboard.writeText(id);
            new Notice("Copied to clipboard.");
        }
    });
}

let lucide_ids = obsidian.getIconIds()
    .filter(id => id.startsWith("lucide-"))
    .map(id => id.slice(7));
dv.paragraph(`${lucide_ids.length} Lucide icons`);
renderIconTable(lucide_ids);

let other_ids = obsidian.getIconIds().filter(id => !id.startsWith("lucide-"));
dv.paragraph(`${other_ids.length} other icons`);
renderIconTable(other_ids);

Tysm for this! I refactored a little in my own fork to add a search box 😛

Thank You!

I also created a website for searching through all icons (with some additional filtering functionality), in case you don't use DataView, available here: https://fevol.github.io/obsidian-notes/utils/icons/

Forum topic: https://forum.obsidian.md/t/search-icons-available-in-obsidian/101408

Thank you!