🔥 Stop copying box-shadows manually from Figma to Webflow - there's a smarter way.

November 21, 2025
image of desk with computer

⚡⚡ Figma → Webflow: The Smart Way to Transfer Multiple Box-Shadows

Have you ever tried moving a button from Figma to Webflow that uses multiple box-shadows?

You could copy them over one by one… but there’s a much smarter way.

If you have access to Figma Dev Mode, you can grab the full box-shadow CSS and paste it directly into Webflow.

Here’s how:

1. Select the element in Figma (e.g., the button).

2. Switch to Dev Mode.

3. Change the code view to CSS in the right panel.

4. Find the box-shadow under Style and copy the values.

5. Go to the button in Webflow.

6. Scroll down in the style panel and add a Custom Property.

7. Select box-shadow and paste in the CSS.That’s it - all your box-shadows transferred at once, perfectly and instantly.

Now, congratulate yourself and grab a cup of coffee. ☕