diff --git a/apps/toolbox/src/pages/image-handling.ts b/apps/toolbox/src/pages/image-handling.ts
index 563498f1f..7dd8a98f1 100644
--- a/apps/toolbox/src/pages/image-handling.ts
+++ b/apps/toolbox/src/pages/image-handling.ts
@@ -10,10 +10,10 @@ export function navigatingTo(args: EventData) {
 
 export class DemoModel extends Observable {
 	addingPhoto = false;
-	symbolWiggleEffect: ImageSymbolEffects.Wiggle;
-	symbolBounceEffect: ImageSymbolEffects.Bounce;
-	symbolBreathEffect: ImageSymbolEffects.Breathe;
-	symbolRotateEffect: ImageSymbolEffects.Rotate;
+	symbolWiggleEffect = ImageSymbolEffects.Scale;
+	symbolBounceEffect = ImageSymbolEffects.Bounce;
+	symbolBreathEffect = ImageSymbolEffects.Breathe;
+	symbolRotateEffect = ImageSymbolEffects.Rotate;
 
 	pickImage() {
 		const context = create({
diff --git a/apps/toolbox/src/pages/image-handling.xml b/apps/toolbox/src/pages/image-handling.xml
index ad735e19b..bd72a64ba 100644
--- a/apps/toolbox/src/pages/image-handling.xml
+++ b/apps/toolbox/src/pages/image-handling.xml
@@ -14,15 +14,15 @@
             <!-- SF Symbols with Effects -->
             <ContentView height="1" width="100%" backgroundColor="#efefef" margin="10"></ContentView>
             <GridLayout rows="auto,auto,auto" columns="*,*">
-                <Image src="sys://photo.on.rectangle.angled" width="100" tintColor="green" symbolEffect="{{symbolWiggleEffect}}" padding="8"/>
-                <Image col="1" src="sys://steeringwheel.and.hands" width="100" tintColor="black" symbolEffect="{{symbolWiggleEffect}}" padding="8" />
+                <Image src="sys://photo.on.rectangle.angled" width="100" tintColor="green" iosSymbolEffect="{{symbolWiggleEffect}}" padding="8"/>
+                <Image col="1" src="sys://steeringwheel.and.hands" width="100" tintColor="black" iosSymbolEffect="{{symbolWiggleEffect}}" padding="8" />
 
-                <Image row="1" src="sys://airpods.pro.chargingcase.wireless.radiowaves.left.and.right.fill" width="100" symbolEffect="{{symbolBounceEffect}}" padding="8" />
-                <Image row="1" col="1" src="sys://lungs.fill" width="100" symbolEffect="{{symbolBreathEffect}}" padding="8" />
+                <Image row="1" src="sys://airpods.pro.chargingcase.wireless.radiowaves.left.and.right.fill" width="100" iosSymbolEffect="{{symbolBounceEffect}}" padding="8" />
+                <Image row="1" col="1" src="sys://lungs.fill" width="100" iosSymbolEffect="{{symbolBreathEffect}}" padding="8" />
 
 
-                <Image row="2" src="sys://clock.arrow.trianglehead.2.counterclockwise.rotate.90" width="100" symbolEffect="{{symbolRotateEffect}}" padding="8" />
-                <Image row="2" col="1" src="sys://square.and.arrow.up" width="100" symbolEffect="{{symbolWiggleEffect}}" padding="8" />
+                <Image row="2" src="sys://clock.arrow.trianglehead.2.counterclockwise.rotate.90" width="100" iosSymbolEffect="{{symbolRotateEffect}}" padding="8" />
+                <Image row="2" col="1" src="sys://square.and.arrow.up" width="100" iosSymbolEffect="{{symbolWiggleEffect}}" padding="8" />
             </GridLayout>
         </ios>
 
diff --git a/packages/core/ui/image/index.ios.ts b/packages/core/ui/image/index.ios.ts
index cf3d0d179..817597d86 100644
--- a/packages/core/ui/image/index.ios.ts
+++ b/packages/core/ui/image/index.ios.ts
@@ -201,7 +201,8 @@ export class Image extends ImageBase {
 			return;
 		}
 		const symbol = typeof value === 'string' ? ImageSymbolEffect.fromSymbol(value) : value;
-		if (symbol && symbol.effect) {
+		if (symbol?.effect) {
+			console.log('symbol.effect:', symbol.effect);
 			this.nativeViewProtected.addSymbolEffectOptionsAnimatedCompletion(symbol.effect, symbol.options || NSSymbolEffectOptions.optionsWithRepeating(), true, symbol.completion || null);
 		} else {
 			this.nativeViewProtected.removeAllSymbolEffects();
diff --git a/packages/core/ui/image/symbol-effects.android.ts b/packages/core/ui/image/symbol-effects.android.ts
index 27eff8434..bd02f2736 100644
--- a/packages/core/ui/image/symbol-effects.android.ts
+++ b/packages/core/ui/image/symbol-effects.android.ts
@@ -1,9 +1,8 @@
-import { ImageSymbolEffectCommon, ImageSymbolEffects } from './symbol-effects-common';
-import type { ImageSymbolEffect as ImageSymbolEffectDefinition } from './symbol-effects.d.ts';
-export { ImageSymbolEffects };
+import { ImageSymbolEffectCommon } from './symbol-effects-common';
+export { ImageSymbolEffects } from './symbol-effects-common';
 
-export const ImageSymbolEffect: typeof ImageSymbolEffectDefinition = class ImageSymbolEffect extends ImageSymbolEffectCommon implements ImageSymbolEffectDefinition {
-	static fromSymbol(symbol: string): ImageSymbolEffectDefinition {
+export class ImageSymbolEffect extends ImageSymbolEffectCommon {
+	static fromSymbol(symbol: string) {
 		return new ImageSymbolEffect();
 	}
-};
+}
diff --git a/packages/core/ui/image/symbol-effects.ios.ts b/packages/core/ui/image/symbol-effects.ios.ts
index 0ae1bfee7..96c544397 100644
--- a/packages/core/ui/image/symbol-effects.ios.ts
+++ b/packages/core/ui/image/symbol-effects.ios.ts
@@ -1,13 +1,13 @@
 import { SDK_VERSION } from '../../utils/constants';
 import { ImageSymbolEffectCommon, ImageSymbolEffects } from './symbol-effects-common';
-import type { ImageSymbolEffect as ImageSymbolEffectDefinition } from './symbol-effects.d.ts';
+export { ImageSymbolEffects } from './symbol-effects-common';
 
-export const ImageSymbolEffect: typeof ImageSymbolEffectDefinition = class ImageSymbolEffect extends ImageSymbolEffectCommon implements ImageSymbolEffectDefinition {
+export class ImageSymbolEffect extends ImageSymbolEffectCommon {
 	constructor(symbol: NSSymbolEffect) {
 		super();
 		this.effect = symbol;
 	}
-	static fromSymbol(symbol: string): ImageSymbolEffectDefinition | null {
+	static fromSymbol(symbol: string): ImageSymbolEffect | null {
 		if (SDK_VERSION < 17) {
 			return null;
 		}
@@ -92,4 +92,4 @@ export const ImageSymbolEffect: typeof ImageSymbolEffectDefinition = class Image
 
 		return null;
 	}
-};
+}