Glossário

Glossary — Lucide

absoluteStrokeWidth — a boolean prop (React/Vue/Svelte/etc. wrappers) that keeps the stroke width visually constant regardless of the icon's rendered size, instead of scaling the stroke proportionally. (Ch 16-147, framework basics/stroke-width chapters)

aliased icon names — alternate export names for the same icon (e.g. legacy or deprecated names kept for backwards compatibility during renames). Import the current canonical name unless migrating old code. (Ch "Aliased Names" chapters, React/Vue/Svelte/Solid/Preact/Angular)

attrs — an option accepted by createIcons() (vanilla JS) to pass additional custom attributes (CSS classes, stroke options, etc.) applied to every rendered icon element. (Ch 2, Vanilla JS getting started)

color prop / color attribute — sets the icon's stroke color directly; overrides the default currentColor inheritance. (Ch "Color" chapters, all frameworks)

combining icons — the pattern of layering multiple icon components (e.g. a badge or overlay icon positioned over a base icon) using CSS positioning, documented per-framework. (Ch "Combining Icons" chapters)

createElement — the vanilla JS / static package function that builds a single icon's DOM/SVG element programmatically, as an alternative to createIcons() bulk-replacement or per-framework components.

createIcons() — the vanilla JS bulk-replacement function: scans the DOM for elements with the data-lucide attribute (or a custom nameAttr) and replaces them with the corresponding inline SVG icon.

currentColor — the default color value on every Lucide icon; makes the icon inherit its color from the computed CSS color of the element or its parent, per standard SVG/CSS behavior.

data-lucide attribute — the default HTML attribute (data-lucide="icon-name") that createIcons() scans for in vanilla JS usage; the attribute name is configurable via the nameAttr option.

dynamic icon component — a per-framework helper (React: DynamicIcon, similarly named in other wrappers) that renders an icon by name string at runtime instead of a static import, useful when the icon name is data-driven. (Ch "Dynamic Icon Component")

filled icons — a rendering variant/pattern for producing a filled (not just stroked) version of an icon, documented per framework under "Filled Icons".

global styling — the pattern of setting default icon props (size, color, stroke-width) once at an app-wide level instead of per-instance, documented per framework under "Global Styling".

IconNode — the internal data structure Lucide uses to represent an icon's SVG paths/shapes before it is rendered by a specific framework's renderer.

inTemplates — a createIcons() option (vanilla JS) that, when true, also replaces data-lucide elements found inside <template> tags, which are otherwise inert to the DOM scan.

lucide-lab — a companion package of additional/experimental icons not in the core Lucide set; used alongside the main package "with-lucide-lab" per framework.

nameAttr — a createIcons() option (vanilla JS) to change which HTML attribute is scanned for icon names, replacing the default data-lucide.

root option — a createIcons() option (vanilla JS) that scopes the DOM scan/replacement to a specific element subtree instead of the whole document; useful for Shadow DOM or partial re-renders.

sizing — the size prop/attribute controlling an icon's rendered width/height, documented per framework under "Sizing".

static package (lucide-static) — the distribution of Lucide as plain SVG/PNG/webfont assets for use without a JS bundler (e.g. <img> tags, CSS sprites, or a webfont).

stroke-width — the SVG stroke thickness of an icon, adjustable via a strokeWidth prop/attribute; see also absoluteStrokeWidth.

tree-shaking — the bundler optimization Lucide's per-icon module structure enables: importing only the specific icon components used means unused icons are not included in the production bundle.

with-lucide-lab pattern — the documented approach for registering/using lucide-lab icons alongside the standard icon set in a given framework.