테두리·둥근 모서리 이미지 만들기, 어떤 설정이 필요한가?
상품 이미지나 프로필 사진을 디자인에 넣을 때 이미지 모서리가 너무 딱딱해 보이거나, 원형 이미지처럼 특정한 형태가 필요한 경우가 있습니다. 이때 별도의 디자인 프로그램을 열지 않고 모서리 모양, 테두리, 그림자, 배경을 한 번에 조절할 수 있으면 작업이 훨씬 간단해집니다.
이미지 테두리·둥근 모서리 도구는 JPG·PNG·WebP 이미지를 불러와 둥근 모서리 또는 원형 형태로 바꾸고, 필요한 경우 테두리와 그림자를 추가할 수 있도록 구성했습니다. 투명 또는 단색 배경을 선택하고 출력 형식과 품질까지 정할 수 있어, 블로그·쇼핑몰·프로필 이미지처럼 외곽 스타일을 맞춰야 하는 작업에 사용할 수 있습니다.

먼저 이미지 형태부터 정하세요
가장 기본적인 선택은 둥근 모서리와 원형입니다. 일반적인 카드형 이미지라면 둥근 모서리가 자연스럽고, 프로필 사진이나 아이콘처럼 원형으로 보여야 한다면 원형 이미지를 선택하면 됩니다.
둥근 모서리는 모든 모서리를 같은 값으로 연결해서 조절할 수도 있고, 왼쪽 위·오른쪽 위·오른쪽 아래·왼쪽 아래를 각각 다르게 설정할 수도 있습니다. 디자인에 따라 특정 모서리만 크게 둥글게 만드는 것도 가능합니다.
| 형태 | 어울리는 이미지 | 조절 기준 |
|---|---|---|
| 둥근 모서리 | 카드, 상품 이미지, 썸네일 | 모서리 반경과 네 모서리의 균형 |
| 원형 | 프로필, 아이콘, 인물 이미지 | 이미지가 원 안에서 잘리지 않는지 |
모서리 반경은 클수록 항상 좋은 것은 아닙니다
모서리 반경을 조금만 적용하면 모서리의 딱딱한 느낌만 줄일 수 있고, 크게 적용하면 카드 자체가 부드러운 형태로 바뀝니다. 이미지의 내용보다 외곽 형태가 더 눈에 띄면 오히려 디자인이 과해질 수 있으므로 주변 카드나 페이지 스타일과 함께 보는 것이 좋습니다.
빠르게 적용하고 싶다면 미리 준비된 모서리 프리셋을 사용할 수 있습니다. 마음에 들지 않으면 개별 값을 직접 조절하면서 원하는 정도를 찾으면 됩니다.
테두리는 이미지와 배경 사이의 경계를 분명하게 합니다
배경과 이미지의 경계가 약하거나 카드 형태를 강조하고 싶다면 테두리를 추가할 수 있습니다. 테두리는 두께와 색상을 정할 수 있고, 이미지 안쪽·중앙·바깥쪽 가운데 어느 위치에 놓을지도 선택할 수 있습니다.
밝은 이미지에 흰색 테두리를 넣으면 거의 보이지 않을 수 있고, 어두운 배경에서는 검은색 테두리가 묻힐 수 있습니다. 따라서 테두리 색은 이미지 자체보다 주변 배경과의 대비를 기준으로 선택하는 편이 자연스럽습니다.
그림자는 이미지가 떠 있는 느낌을 만들 수 있습니다
그림자는 카드나 상품 이미지가 배경에서 살짝 떠 있는 것처럼 보이게 만들 때 유용합니다. 가로·세로 위치, 블러, 확산, 불투명도, 그림자 색을 각각 조절할 수 있습니다.
그림자가 너무 진하거나 넓으면 이미지보다 그림자가 먼저 보일 수 있으므로, 먼저 약하게 적용한 뒤 배경과의 분리감이 충분한지 확인하는 방식이 좋습니다. 자동 여백을 사용하면 그림자가 캔버스 밖으로 잘리지 않도록 여백을 함께 확보할 수 있습니다.
투명 배경과 단색 배경은 사용 목적이 다릅니다
배경은 투명 또는 단색으로 선택할 수 있습니다. 다른 디자인 위에 이미지를 올릴 예정이라면 투명 배경이 편하고, 이미지 자체가 완성된 카드처럼 보여야 한다면 단색 배경을 사용할 수 있습니다.
단색 배경을 선택하면 원하는 색상을 지정할 수 있습니다. 투명 배경을 사용할 때는 결과 파일의 형식도 함께 확인해야 합니다. PNG와 WebP는 투명도를 유지할 수 있지만 JPG는 투명 배경을 지원하지 않기 때문에 지정한 배경색으로 저장됩니다.
원형 이미지는 주변 여백을 함께 확인하세요
원형 모드를 선택하면 원본 이미지가 원형 영역 안에 들어가도록 결과 캔버스가 구성됩니다. 인물이나 상품처럼 가장자리에 중요한 내용이 있는 경우에는 원 안에서 대상이 잘리는지 먼저 확인하는 것이 좋습니다.
특히 얼굴 사진은 머리카락이나 어깨가 원형 경계에 걸릴 수 있으므로 결과 미리보기에서 전체 구도를 확인한 뒤 저장하세요.
원본과 결과를 번갈아 보면 차이를 확인하기 쉽습니다
편집 화면에서는 원본 보기와 결과 보기를 전환할 수 있고, 확대·축소와 화면 맞춤도 사용할 수 있습니다. 모서리 반경이나 그림자처럼 작은 차이는 축소 화면에서는 잘 보이지 않을 수 있으므로 필요할 때 확대해서 경계를 확인하는 것이 좋습니다.
결과가 너무 과해 보이면 해당 설정만 다시 조정하거나 전체 설정을 초기화해 처음부터 다시 비교할 수 있습니다. 실행 취소와 다시 실행도 지원하므로 여러 조합을 시험해 보기 편합니다.
출력 형식과 품질은 마지막에 정하세요
출력은 원본 형식을 유지하거나 JPG, PNG, WebP로 바꿀 수 있습니다. JPG와 WebP는 품질을 조절할 수 있고 PNG는 투명 배경을 유지해야 하는 경우에 적합합니다.
최종 용도가 웹 게시라면 파일 크기도 함께 확인하고, 투명 배경이 필요한 디자인이라면 형식을 먼저 확인하는 것이 좋습니다. 파일명을 직접 지정할 수도 있어 디자인 작업 후 결과물을 구분하기 쉽습니다.
여러 설정을 한 번에 바꾸기보다 핵심부터 맞추세요
이 도구는 모서리, 테두리, 그림자, 배경을 동시에 조절할 수 있기 때문에 처음부터 모든 값을 크게 바꾸기보다 형태부터 정하는 것이 편합니다. 먼저 둥근 모서리 또는 원형을 선택하고, 필요하면 테두리, 그다음 그림자와 배경을 추가하는 순서로 작업하면 각각의 변화가 눈에 잘 들어옵니다.
특히 카드 디자인처럼 전체 스타일이 중요한 경우에는 테두리와 그림자를 모두 강하게 적용하기보다 둘 중 하나를 중심 요소로 정하고 나머지를 보조적으로 사용하는 편이 깔끔합니다.
결과에서는 원본 크기와 결과 크기도 확인하세요
작업이 끝나면 원본 크기와 결과 크기를 확인할 수 있습니다. 그림자나 추가 효과를 사용하면 결과 캔버스가 원본보다 넓어질 수 있으므로, 웹사이트에서 정해진 이미지 크기가 있다면 저장 전에 결과 크기를 확인하는 것이 좋습니다.
결과 이미지가 준비되면 다운로드할 수 있고, 다시 작업 화면으로 돌아가 설정을 수정할 수도 있습니다.
핵심 정리
- 카드형 이미지는 둥근 모서리, 프로필이나 아이콘은 원형 형태가 잘 맞습니다.
- 둥근 모서리는 전체 모서리를 연결해서 조절하거나 네 모서리를 각각 다르게 설정할 수 있습니다.
- 테두리는 두께·색상·정렬 위치를 조절하고, 그림자는 위치·블러·확산·불투명도를 조절할 수 있습니다.
- 투명 배경이 필요한 경우 PNG 또는 WebP를 우선 확인하고 JPG 저장 시 배경색이 적용되는 점을 기억해야 합니다.
- 최종 결과에서는 모서리, 테두리, 그림자뿐 아니라 결과 캔버스 크기와 출력 형식까지 함께 확인하는 것이 좋습니다.
직접 확인하기
이미지 테두리·둥근 모서리 도구에서 둥근 모서리, 원형, 테두리, 그림자와 배경 설정을 직접 비교해 볼 수 있습니다.
댓글
댓글 쓰기