Hover effects

Hover effects are very useful to make your element stand out when viewers hovers over it, inviting them to interact with the element further. These effects can be used to indicate that your element is clickable, and can be added and configured in the effects menu in the object tab of the configuration panel on the right side of the editor. You can add multiple hover effects to a single element.

Note: because hovering isn't possible on mobile devices, these effects will not work and are therefore disabled in the mobile editor.

Select the type of hover effects you would like to add and configure them through the wrench icon. This will open a small window in which you can configure the effect further.

An explanation of the hover effect types is described below:

Shadow: adds a drop shadow behind the chosen object. You can then edit the shadows intensity, positioning, color and blur settings.
Text shadow: this is similar to shadows, but will only affect the text shadows instead of objects.
Black and white: this will change the colours of the objects to Black and White(Grayscale).
Blur: This will add a blur to the object, making it less sharp.
Background color: This will change the objects background color to a chosen color.
Text color: This will change the text color of an object, such as button text or entire text blocks.
Grow: This will make the object larger or smaller, depending on the setting.
Move: This will move the object a certain distance from the edges of the canvas.
Rotate: This will rotate the object to certain degree set, based on the anchor point chosen.
Border: This will add a border to the object with a color and width in pixels.
Transparency: This will make the object more see-through, depending on the setting.
Attention seeker: This will make the object perform a specific animation from the drop-down menu, such as shake or pulse.
Manual: This allows you to change multiple settings such as position, size, color etc to a single object.

Updated on: 02/01/2023