온라인 이미지 테두리 추가

테두리 추가가 하는 일

테두리 추가는 사진 위에 필터를 씌우는 것이 아니라 캔버스에서 직접 작동합니다. 이미지를 원본보다 큰 메모리 내 HTML 캔버스로 불러오는데 — 캔버스의 너비와 높이 모두 각 변마다 한 번씩, 테두리 너비 값의 정확히 두 배만큼 커집니다 — 그런 다음 그 바깥 가장자리 둘레에 테두리 색상으로 직사각형 프레임을 그리고, 원본 이미지를 원래 해상도 그대로 손대지 않고 새로 생긴 여백 한가운데에 그립니다. 사진 자체의 픽셀은 전혀 건드리지 않습니다 — 이 도구는 위에 칠하거나 다시 샘플링하는 대신 주변에 소재를 추가할 뿐입니다. 실선 스타일은 테두리 너비 전체를 하나의 연속된 선으로 그립니다. 이중선 스타일은 같은 너비를 바깥 고리, 간격, 안쪽 고리라는 대략 동일한 세 구간으로 나누고 두 고리 모두에 같은 테두리 색상을 사용해, 두 선 사이에 얇게 비어 있는 공간이 있는 고전적인 액자 느낌을 만듭니다. 이 세 구간 각각이 렌더링되려면 최소 1픽셀이 필요하기 때문에, 이중선 효과는 너비가 충분히 넉넉할 때, 대략 15px 이상일 때만 두 개의 뚜렷한 선으로 보입니다 — 너비가 작으면 구간들이 서로 압축되어 하나의 두꺼운 선처럼 보입니다. 테두리는 특정한 의미에서 균일합니다. 하나의 테두리 너비 값이 네 변 모두에 동시에 적용되고, 모서리는 사진 자체가 어떤 모양이든 항상 직각으로 유지됩니다 — 이 도구는 모서리를 둥글게 처리하지 않으며, 변마다 다른 너비나 비대칭 매트를 위한 컨트롤도 없습니다. 출력은 원본 파일의 형식을 유지하므로, JPEG에 추가한 테두리는 JPEG로 남고 PNG에 추가한 것은 PNG로 남습니다. 이는 이중선 스타일의 간격에서 중요한 의미를 갖습니다 — 그 간격은 어떤 색으로도 채워지지 않으므로, PNG에서는 투명하게 렌더링되지만 JPEG에는 알파 채널이 없으므로 단색 검은색으로 렌더링됩니다.