Boxy SVG
SVG는 아이콘, 배너, 차트, 일러스트 등 벡터 그래픽을 저장하기 위한 표준 형식입니다. Boxy SVG 프로젝트……
- macOS 12.0 or later, 64-bit processor
소개
SVG는 아이콘, 배너, 차트, 일러스트 등 벡터 그래픽을 저장하기 위한 표준 형식입니다. Boxy SVG 프로젝트의 목표는 비기술자부터 전문 디자이너 및 개발자까지 모든 사용자에게 최고의 SVG 편집기를 제공하는 것입니다.
핵심 기능:
• Inkscape, Sketch, Adobe Illustrator에서 영감을 얻은 깔끔하고 직관적인 UI
• 객체의 기하학적 속성, 변환, 채색 및 기타 속성을 캔버스 상에서 직접 편집할 수 있는 광범위한 지원
• SVG 및 SVGZ 형식으로 저장 가능하며, PNG, JPG, WebP, PDF, HTML5로 내보내기 지원
• 수천 개의 무료 벡터 아트를 제공하는 Open Clip Art Library 통합
• 수백 가지 무료 글꼴을 제공하는 Google Fonts 통합
• 100개 이상의 명령어에 대해 설정 가능한 키보드 단축키
• 수동 가이드, 스마트 가이드, 격자 기능
• 경로 연산(병합, 교차, 빼기, 제외, 닫기, 반전 등)
• 정렬 연산(정렬, 회전, 뒤집기, 순서 변경, 그룹화 등)
웹 개발자를 위한 기능:
• Chromium 기반 렌더링 엔진
• Chrome Dev Tools와 유사한 SVG 및 CSS 코드 인스펙터
• ID, 클래스, 제목 등 메타데이터를 보존하는 깔끔한 SVG 출력
• SVG 스프라이트 편집 지원
새로운 기능(버전 4.111.0):
• 추가: OpenMoji 라이브러리
• 추가: PNG/JPEG 내보내기 시 '색상 공간' 옵션
• 수정: '경로 연결' 명령어가 작동하지 않던 문제
필요 사양: macOS 12.0 이상, 64비트 프로세서
스크린샷
광고 차단기를 사용 중이신 경우, 당사를 화이트리스트에 등록해 주시기 바랍니다! 광고 수익은 고품질 콘텐츠를 제공하기 위한 우리의 핵심 자원입니다! 또는 이 안내를 읽어 보시면, 어떻게 우리를 지원하실 수 있는지 확인하실 수 있습니다. 감사합니다!
크기: 222.5MB
이전 버전
편집자 확인 정보
표준 SVG를 직접 납품하는 프런트엔드, 디자인 시스템, 아이콘/로고 디자이너, 제품 팀에 권합니다. “viewBox/이름/접근성 규칙 → symbol/use/filter/mask/font/foreignObject fixture → 시각 편집+Elements/CSS 감사 → ID/class 고정 → 복사본 lint/optimize → Safari/Chrome/Firefox+실제 component 회귀 → 작은 크기 대비/키보드/screen reader → source SVG+optimized SVG+PNG proof+manifest”를 운영하세요. Boolean/Join Paths 전 복사본을 남기고 공개 asset은 불필요 foreignObject/불안정 외부 링크를 피합니다. OpenMoji 등은 license/attribution을 기록하고 bitmap color space를 고정합니다. 복잡한 UI/브랜드는 Sketch, 깊은 일러스트는 Affinity Designer/Amadine/EazyDraw, SVG markup/sprite가 결과물이라면 Boxy SVG가 적합합니다. CMYK 인쇄, 페이지 편집, 사진 합성은 전용 도구를 씁니다.
장점
- 독점 문서가 아니라 SVG 자체를 중심으로 canvas와 SVG/CSS inspector가 연동되어 ID, class, symbol, title, metadata를 제어하려는 프런트엔드, 아이콘 디자이너, 디자인 시스템 팀에 맞습니다. Chromium 렌더링으로 브라우저 동작을 일찍 확인합니다. 표준 SVG는 Git, code review, diff, sprite, component pipeline에 바로 들어가 lock-in이 적습니다. path Boolean/arrangement, guide/grid, gradient/filter/marker, sprite, shortcut이 일상 Web vector를 지원합니다. SVG/SVGZ와 PNG/JPEG/WebP/PDF/HTML5 출력으로 한 원본을 코드·미리보기·납품에 쓰며 4.111.0의 color space와 OpenMoji가 유용합니다. 작은 아이콘, 로고, 일러스트, 데이터 그래픽, Web animation, SVG component에는 대형 suite보다 직접적입니다.
단점
- SVG 특화라 인쇄 레이아웃, 복잡한 multi-artboard 브랜드, 사진/RAW, 전문 CMYK/spot, 장문 출판 도구가 아니며 PNG/JPEG color space가 prepress 시스템을 만들지는 않습니다. Chromium canvas가 Chrome과 가까워도 Safari/Firefox, 메일 클라이언트, native renderer, sanitizer는 다르고 개발자도 use, foreignObject, external reference 경계를 밝힙니다. Google Fonts, Pixabay, OpenMoji/온라인 import는 가용성, 라이선스, 개인정보, 아카이브 문제를 만듭니다. 복잡한 filter, mask, animation, 많은 node는 성능/접근성을 해칠 수 있습니다. XML/CSS에서 ID/class/href를 잘못 바꾸거나 optimizer가 DOM을 바꾸면 script/style이 조용히 깨집니다. Illustrator/Affinity/Sketch보다 복잡한 일러스트, 타이포그래피, plug-in, 협업/교환 생태계가 작고 desktop/Web/PWA의 파일·글꼴·API 권한도 다릅니다.
설치 방법
- Boxy SVG 4.111.0 Mac App Store판은 macOS 12.0 이상이며 Intel과 Apple silicon Mac에서 사용할 수 있습니다. viewBox/preserveAspectRatio, nested transform, symbol/use, marker, mask, clipPath, filter, gradient, pattern, CSS class/ID, 외부 이미지, Google Font, foreignObject, animation, metadata가 포함된 실제 SVG 복사본을 fixture로 만들고 Boxy SVG, Safari, Chrome, Firefox, 실제 embed page에서 비교하세요. 새 아이콘은 viewBox, 좌표 정밀도, 이름, 접근성 title/desc를 고정합니다. Boolean 전 원본 객체를 복제하고 복잡한 Join Paths 뒤 direction, fill-rule, open subpath를 검사하세요. SVG/SVGZ 출력 전 ID, class, title, metadata 보존을 확인하고 외부 asset을 embed/package합니다. PNG/JPEG는 color space를 명시하고 PDF/WebP/HTML5도 font, filter, alpha, size를 별도 검증합니다.
제거 방법
- 삭제 전 모든 편집 원본을 표준 SVG로 보관하고 PNG/PDF만 남기지 않습니다. SVGZ, 미리보기 PNG, 실제 배포 산출물, 브라우저 기준 캡처도 저장하세요. manifest에는 Boxy SVG 버전, viewBox, 크기, color space, 글꼴 출처/라이선스, 외부 리소스, ID/class/API 계약, sprite symbol, animation/CSS/JS 의존성, optimizer 버전, SHA-256, 검증 브라우저를 기록합니다. Google Fonts, Pixabay, OpenMoji 등은 실제 asset, license/attribution, 취득일을 보관하며 URL만 아카이브로 보지 않습니다. external href, image, font, CSS를 오프라인에서 검증하고 component/NPM은 package lock, config, build script도 저장합니다. 다른 브라우저/텍스트 편집기에서 valid XML과 app-only reference 부재를 확인한 뒤 삭제하세요. 계정/클라우드는 별도 처리합니다.
자주 발생하는 오류와 해결 방법
- 편집기/브라우저 표시 차이는 개발자가 use, foreignObject, 외부 참조를 많이 쓰는 일부 파일에서 가능하다고 밝힙니다. Safari/Chrome/Firefox 최소 재현으로 namespace, href/xlink:href, base URL, CORS, 글꼴, CSS를 확인하세요. 잘림/배율은 viewBox, width/height, preserveAspectRatio, transform origin, filter bounds를 봅니다. Join Paths 뒤 fill/hole 문제는 subpath 방향, nonzero/evenodd, 열린 endpoint, transform을 확인하며 4.111.0의 명령 수정이 topology를 결정해 주지는 않습니다. Google Font path 변환은 로드/Local Font Access를 확인하고 복사본만 변환하세요. 외부 이미지/글꼴은 embed 또는 상대 경로로 묶고 MIME/CSP/CORS를 점검합니다. PNG/JPEG는 새 Color space를 명시해 target에서 검증하세요. 느린 animation/filter는 node, blur, filter region을 줄이고 최적화 전 ID/class와 DOM/시각 회귀를 고정합니다.
이번 버전 변경 사항
- 공식 4.111.0 기록은 OpenMoji 라이브러리 추가, PNG/JPEG export의 Color space 옵션, Join Paths 명령 미작동 수정의 세 항목입니다. 다른 branch 변경을 섞지 않습니다. SVG를 native 편집 형식으로 사용하며 canvas geometry/transform/paint, path Boolean/arrangement, manual/smart guide, grid, SVG/CSS Elements inspector, SVG sprite, ID/class/title/metadata 보존을 제공합니다. SVG/SVGZ 저장, PNG/JPEG/WebP/PDF/HTML5 출력, Chromium 기반 렌더링입니다. Mac App Store 최소 macOS 12.0, 간체 중국어·일본어·한국어 등 다국어이며 개인정보 라벨은 데이터 미수집입니다. 개발자도 전체 SVG 표준을 완전히 지원하는 편집기는 없다고 설명하므로 use/foreignObject/외부 참조를 많이 쓰면 cross-browser 검증이 필요합니다.
대체 소프트웨어
스크린샷
