What is Mask Image?

A masked image is a black and white image that tells Luw.ai generators to which areas to change.

Think of it like a stencil - white areas will be changed, while black areas stay protected. This technique gives you precise control over where edits appear in your image. It must be the same size with the image you provided.

Original vs Masked Images

• Image: Your normal photo with objects like chairs, mirrors, lamps, or pillows

• Masked Image: A black and white version where:

  • White: Areas you want to edit

  • Black: Areas you want to leave alone

Creating a Masked Image

Visit beta.luw.ai/magicwand?mask_export=true to create your mask:

1. Upload your photo

2. Mark areas using either:

   • The brush tool to paint manually

   • AI detection to automatically select objects

3. Click "Download"

Developer Tools

If you're building with an application using Magic Wand, you'll need to handle masked images. Here are recommended tools:

React

1. react-canvas-draw

• Simple mask drawing

• React optimized

• Easy to integrate

1. react-sketch-canvas

• Touch friendly

• Clean mask output

• React hooks ready

1. react-konva

• Powerful canvas control

• React components

• Most popular option

Vue

1. vue-konva

• Vue 3 compatible

• Similar to react-konva

• Full mask features

1. v-canvas

• Lightweight drawing

• Vue optimized

• Simple masking

Angular

1. ng2-canvas-whiteboard

• Angular focused

• Touch support

• Mask export

1. konva-angular

• Feature rich

• TypeScript ready

• Professional grade

Mobile Cross-Platform

1. React Native Skia

• Native performance

• Cross platform

1. Flutter Custom Paint

• Clean mask drawing

• Touch optimized

iOS/Swift

1. PencilKit

• Drawing optimized

• Mask export

Pick based on needs:

• React → react-sketch-canvas

• Vue → vue-konva

• Angular → konva-angular

• React Native → React Native Skia

• Flutter → Custom Paint

• iOS → PencilKit

note: add extra methods like soften to 3d, seed to non seed models etc..