diff --git a/packages/icon/demo/usage.html b/packages/icon/demo/usage.html
new file mode 100644
index 0000000..5746489
--- /dev/null
+++ b/packages/icon/demo/usage.html
@@ -0,0 +1,211 @@
+
+
+
+
+
+ Iconify Icon Demo: Usage
+
+
+
+
+
+
+ This is a simple HTML page with few icons.
+ There are 2 entries for each sample: one as inline SVG, one using
+ style.
+
+
+ Icons that behave like images:
+
+
+
+
+
+
+ Icon that behaves like an glyph (aligned to bottom of this text):
+
+
+
+
+
+
+ Changing icon color:
+
+
+
+
+ Big icon (showing various ways to do it):
+
+
+
+
+
+ Icons above should be aligned differently because they have
+ different font-size. Vertical alignment is relative to font size.
+
+
+ Big icon (showing various ways to do it):
+
+
+
+
+
+ Icons above should be aligned identically because they are not using
+ inline mode.
+
+
+ Rotation:
+
+
+
+
+
+
+
+
+
+
+ Flip:
+
+
+
+
+
+
+
+
+
+
+
diff --git a/packages/icon/src/component.ts b/packages/icon/src/component.ts
index 9d46031..91dec51 100644
--- a/packages/icon/src/component.ts
+++ b/packages/icon/src/component.ts
@@ -149,7 +149,7 @@ export function defineIconifyIcon(
}
case 'inline': {
- const newInline = !!newValue;
+ const newInline = getInline(this);
if (newInline !== state.inline) {
// Update style if inline mode changed
state.inline = newInline;