• 0k
  • 0
Ideas & Inspiration \ SEP 27th 2010

Wix Tricks: Emphasize Promotions with Color Transitions

Adding color movement to your flash website is a great way to spice up your design, and attract visitors attention to specific promotions or focus them on any other relevant content.

Creating basic color transitions with Wix is super simple and these can be applied both to photos and text.

Start with a mini page:

  1. Page parts–> mini page.
  2. Edit size to fit your needs.
  3. Click “Manage” and make sure you have three pages.

Wix Editor Mini Page

Put the mini page aside for a moment.

Edit the graphic elements:

  1. Choose a graphic element.
  2. Duplicate it three times (Ctrl+D or Edit –> Duplicate).
  3. Change each element color (by using the “Tint Effect” for graphic elements, or “Color Adjustment” effect for photos).

*make sure all elements are always the same size

Wix Editor tint

Return to you mini page:

  1. Place the first element right at the center of the mini page.
  2. Open the transform box, Arrange–> Transform.
  3. Copy the “X” and “Y” Settings and apply them to the other elements. This will ensure that they are placed exactly one above the other.
  4. Now place each element on a different page within the “Mini Page”.

Wix Editor transform box

Editing the transitions:

  1. Click on the mini Page.
  2. Go to transitions, The best transitions for color change are either “None” or ” Alpha”.
  3. Go to setting and choose “Auto Play”.
  4. Edit the page duration. The closer to 0 the faster the color change is.

Wix Editor Transitions Settings

And here is the result!

To view your own result click on “Preview”. You can always go back and re-edit according to need.


Get The Wix Blog
Straight to Your Email

Subscribe to the WixBlog And never miss an update!

Hmmm, that's not a valid email address.

Hmmm, that's not a valid email address.

Join Us! \ 

Get the latest and freshest content on creating
& marketing your Wix website.

Hmmm, that's not a valid email address.

Hmmm, that's not a valid email address.