Figma Support Forum

How to repeat pattern, suggest some short cut to speed up the design thanks

First of all love figma, I was suggested by senior UI Engineer to use it over writing SVG Code. It helped me speed up process.

I am trying to create a svg pattern logo. I have lot of cross lines. I want to place criss-cross line between two co-centric circle. Can some one please suggest me how to speed up this placing criss-corss line all over the co-centric circle boundaries

Here is my image
criss-cross line have blue ice color
Zoomed

Normal

Please help
Thanks.

hi, sorry if it’s too late, but here…

  1. general way of creation and use of patterns in vector-based software is to make the pattern first, and make it into a component
  2. (since figma has no “tile-filling”) create a few clones of it until it covers the area you want to
  3. scale accordingly
  4. apply mask or object-intersection
  5. make sure the final export has/dont have pixels with alpha-transparency (depending on your intention)

and also, start with everything 10x your intended export size – it will be easier to deal with if your thing is 1000px instead of 100

here is a generalized example, similar to what you showed: https://www.figma.com/file/ngTOMOUwxLbdgYHw7fsPk9/cross-lines

the point for this entire system is so you can just change anything separately, and it will affect all subsequent steps (unless you deliberately detach cloned components):

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.