Figma-like components in Wix + how to replicate Hug / Fill width behavior?

[Fathanah_Dz]

Hi everyone — I’m trying to recreate a Figma-style component workflow in Wix.

1. What’s the best way to build reusable components in Wix (so edits propagate across pages/instances)? Are there “components”/patterns similar to Figma components + variants?

2. In Figma, I rely heavily on Hug contents and Fill container / Fill width. In Wix (Editor / Editor X / Studio), what’s the equivalent approach?

3. Specifically: how do you make an element auto-size to its content (like Hug), and how do you make it stretch responsively to the parent container (like Fill width)?

If you have recommended setups (repeaters, sections, master templates, CSS grid/flex, etc.) or best practices for responsive behavior, I’d love examples.

[noahlovell]

@Fathanah_Dz

What’s the best way to build reusable components in Wix (so edits propagate across pages/instances)? Are there “components”/patterns similar to Figma components + variants?

This isn’t something that’s supported in the same way (at the moment )

@Fathanah_Dz

In Figma, I rely heavily on Hug contents and Fill container / Fill width. In Wix (Editor / Editor X / Studio), what’s the equivalent approach?

You’ll want to use Wix Studio for this. The equivalent is Stacks and CSS Grids

@Fathanah_Dz

Specifically: how do you make an element auto-size to its content (like Hug), and how do you make it stretch responsively to the parent container (like Fill width)?

Using responsive behaviours.

I’d recommend taking a look at some of the videos in the Essentials Course:

Wix Studio Essentials Course | Wix Studio

It’s well worth taking the time to learn - within time the equivalents will become second-nature