Shadows, Gradients, and Other Design Elements

In this section, we'll explore how Monday Hero works with the Figma plug-in.

Here's a list of the information that Monday Hero can process effectively to give you the best results.

Shadow and Blur Effects

You can add blur and shadow effects on Figma to add aesthetics and functionality to your designs. Figma allows you to add drop shadow, inner shadow, layer blur, and background blur effects. You can choose your desired effect with targeted properties and Monday Hero can generate the relevant code for all of them.

Adding the drop shadow effect

Gradients

Figma has different fill options like linear, radial, angular, and diamond to create the gradient effect. Unfortunately, Monday Hero doesn't support these gradient features. That's why, when you're uploading a design to Monday Hero, please be sure that you only use the 'solid fill' option.

Only solid fill option is supported in Monday Hero.

Borders

When you apply borders to an image, you can change its color, weight, distribution, side, and endpoint properties from Figma. With Monday Hero, you can get the relevant code of these properties.

Monday Hero generates the code according to border properties at Figma.

Animations

Animations in Figma are not a supported feature in Monday Hero. That's why, please only upload designs with no animation.