Skip to main content
Participating Frequently
May 22, 2018
해결됨

How to create vector hollow rounded rectangle without the use of stroke

  • May 22, 2018
  • 3 답변들
  • 1760 조회

This might be outside the scope of the program, but I have this super minimalist camera that I'm using to learn how to manipulate SVG for web. In order to use the image as a clipping path in HTML I need to define the rounded rectangle around the outside as a shape, not a path with a border. olSrDyn.png

I'm very new to vector editing.

이 주제는 답변이 닫혔습니다.
최고의 답변: davescm

Draw your first outer rectangle and fill with the angle gradient

Now Alt-Click on the path to duplicate it and in the options bar set path operations to subtract front shape

With the duplicate path selected use Edit - Transform Path -Scale to reduce the size of the front path. After hitting enter to accept the change you will need to adjust the roundness of the corners on the inner shape (in may example the outer corners were set to 60px but the inner corners set to 20px

That is it - done

Dave

3 답변

davescm
Community Expert
davescmCommunity Expert답변
Community Expert
May 22, 2018

Draw your first outer rectangle and fill with the angle gradient

Now Alt-Click on the path to duplicate it and in the options bar set path operations to subtract front shape

With the duplicate path selected use Edit - Transform Path -Scale to reduce the size of the front path. After hitting enter to accept the change you will need to adjust the roundness of the corners on the inner shape (in may example the outer corners were set to 60px but the inner corners set to 20px

That is it - done

Dave

c.pfaffenbichler
Community Expert
Community Expert
May 22, 2018

Mylenium
Legend
May 22, 2018

You simply draw two paths and subtract the inside one. You might wanan read the relevant sections in the help. That said, people don't use PS for building vector-based content. That would be Illustrator, if at all, or tools like the free Inkscape.

Mylenium