Editing SVG Images
SVG images offer the most flexible editing options in PropAify. Choose between manual precision with the SVG editor or quick AI-powered changes via chat.
Two Ways to Edit
1. SVG Editor (Manual Control)
Full visual editor with precise control over every element
2. AI Chat Edits (Quick Changes)
Request changes conversationally for rapid iterations
Using the SVG Editor
Opening the Editor
- Generate or select an SVG image
- Click âEdit in SVG Editorâ
- Editor opens with your design
Editor Features
Text Editing
- Click any text to edit content
- Font selector: Change typeface
- Size controls: Adjust font size
- Weight options: Regular, bold, etc.
- Alignment: Left, center, right
Color Controls
- Color picker: Visual color selection
- Hex input: Enter specific colors
- Opacity slider: Adjust transparency
- Gradient tools: Create color transitions
Transform Tools
- Move: Drag elements to reposition
- Resize: Scale elements up/down
- Rotate: Spin elements to any angle
- Flip: Mirror horizontally/vertically
Layer Management
- Bring forward: Move element up in stack
- Send backward: Move element down
- Lock: Prevent accidental changes
- Group: Combine related elements
Editor Workflow
Step-by-step editing:
- Select element to edit
- Make your changes
- Preview in real-time
- Click âApplyâ to save
- Download or continue editing
AI Chat Editing
For faster edits, use conversational AI commands.
How It Works
- Upload SVG with âEditâ label
- Write your edit request
- AI generates updated version
Example Prompts
Text changes:
- âChange headline to âOPEN HOUSEââ
- âMake subheading smallerâ
- âUpdate price to $850,000â
Color adjustments:
- âChange background to navy blueâ
- âMake text white instead of blackâ
- âAdd gold accentsâ
Layout modifications:
- âMove logo to top rightâ
- âCenter the property photoâ
- âIncrease spacing between elementsâ
Style updates:
- âMake it more modernâ
- âAdd a luxury feelâ
- âSimplify the designâ
Best Practices
â When to Use SVG Editor
- Precise text alignment needed
- Specific color matching required
- Detailed positioning adjustments
- Complex multi-element changes
â When to Use AI Chat
- Quick text updates
- Color scheme changes
- Style explorations
- Simple modifications
Combining Both Methods
- Use AI chat for big changes
- Fine-tune in SVG editor
- Save as template
- Reuse for consistency
Advanced Editing
Brand Consistency
- Set default fonts
- Save brand colors
- Create element libraries
- Build style guides
Template Refinement
- Edit template once
- Reuse across properties
- Update only property-specific content
- Maintain design integrity
Batch Editing Workflow
- Open first SVG in editor
- Make universal changes
- Save as new template
- Apply to other images via AI
Common Edit Scenarios
Updating Property Details
Manual approach:
- Open in SVG editor
- Click price text
- Type new amount
- Click address text
- Update info
AI approach:
- Upload with âEditâ label
- Prompt: âChange price to $1.2M and address to 456 Oak Stâ
Rebranding
Manual approach:
- Replace logo in editor
- Update brand colors
- Change fonts
- Save as new template
AI approach:
- Upload with âEditâ label
- Prompt: âReplace with [new logo], change to [brand colors]â
Seasonal Updates
Manual approach:
- Change color scheme
- Update promotional text
- Adjust visual elements
AI approach:
- Prompt: âMake this a spring theme with pastel colorsâ
Editing Limitations
â Cannot Edit
- JPG images in SVG editor (use JPG mode)
- Locked template elements (unlock first)
- Images beyond 25 per chat
â Can Edit
- Any SVG text element
- Any SVG color or gradient
- Element positioning and size
- Layer order and grouping
Tips for Efficient Editing
Speed Tips
- Learn keyboard shortcuts
- Use snap-to-grid for alignment
- Group related elements
- Create reusable components
Quality Tips
- Preview at actual size
- Check readability on mobile
- Maintain aspect ratios
- Test different backgrounds
Workflow Tips
- Edit template once, reuse often
- Document successful changes
- Save versions before major edits
- Use descriptive file names
Related Articles
- SVG Mode - SVG mode overview
- Editing JPG Images - JPG editing guide
- Uploads and Templates - Template management