AI assistance for elements

Sometimes you need more than simple text or style changes. The Edit Tool's AI Assistance feature lets you ask the AI to help with specific elements, combining the precision of visual selection with the power of AI.

What is AI Assistance?

When you select an element with the Edit Tool, you can send it directly to the AI with a request. This is perfect for:

• Complex changes to a specific element
• Changes you're not sure how to describe
• Asking for design suggestions
• Getting help with functionality

How to Use AI Assistance

Step 1: Select an Element

1. Enable Edit Mode
2. Click on the element you want help with

Step 2: Open AI Tab

In the editing panel, click the AI tab (or look for the magic wand icon ✨).

Step 3: Describe What You Want

Type your request in the prompt field. Be specific about what you want.

Step 4: Send

Click send and the AI will make changes to that specific element.

Example Requests

Design Improvements

"Make this button more prominent and eye-catching"

"This section looks too plain, make it more visually interesting"

"Improve the design of this card to look more modern"

Content Help

"Rewrite this headline to be more compelling"

"Make this description shorter and punchier"

"Add an appropriate icon next to this text"

Functionality

"Make this image clickable to open a larger version"

"Add a hover effect to this button"

"Make this form validate email addresses"

Style Suggestions

"What colors would look good for this section?"

"Suggest a better font for this heading"

"How can I make this stand out more?"

Benefits of AI Assistance

Precision

• The AI knows exactly which element you're talking about
• No confusion about "that thing over there"
• Changes apply to the right place

Context

• The AI sees your element in context
• Understands its role on the page
• Makes appropriate suggestions

Speed

• Faster than describing elements in chat
• Direct connection between selection and action
• Immediate results

When to Use AI Assistance

✅ Great for:

• Improving individual components
• Getting design suggestions
• Making complex style changes
• Adding interactions to elements
• Rewriting specific content

❌ Better to use main chat for:

• Changes affecting multiple elements
• Adding new sections or pages
• Site-wide modifications
• Major structural changes

Tips for Effective Requests

Be Specific

❌ "Make this better"

✅ "Make this testimonial card have a subtle shadow and rounded corners with the author photo in a circle"

Explain Your Goal

"This button should attract more clicks – make it stand out with animation and a stronger color"

Reference Other Elements

"Style this card to match the others in this section"

"Make this heading the same style as the one in the hero section"

Combining the Edit Tool and AI

The most powerful workflow combines both:

1. Browse your site to find areas needing improvement
2. Select elements that need work
3. Use AI Assistance for complex changes
4. Use Style/Text tabs for quick tweaks
5. Review changes in the preview
6. Iterate until perfect

Examples in Action

Example 1: Improving a CTA Button

1. Select the button with the Edit Tool
2. Open AI tab
3. Type: "Make this button impossible to miss – use a gradient, add a subtle pulse animation, and make it larger"
4. Review the AI's changes
5. Fine-tune with Style tab if needed

Example 2: Enhancing a Feature Card

1. Select the feature card
2. Open AI tab
3. Type: "This card looks flat. Add depth with shadows, a hover effect, and an icon that matches the feature description"
4. See the transformation

Example 3: Better Content

1. Select a paragraph
2. Open AI tab
3. Type: "This text is too long and boring. Rewrite it to be concise, engaging, and benefit-focused"
4. Review the new content

Limitations

AI Assistance works within the selected element. For changes that span multiple elements or require new elements, use the main chat.