SVG 편집기를 반응합니다
처음부터 구축 된 SVG 라이브러리가 사용되지 않습니다
링크드 인에서 저를 핑하는 기능 요청에 대해?
더 흥미로운 프로젝트를 위해 LinkedIn에서 나를 팔로우하십시오
사이트를 방문하려면 여기를 클릭하십시오
데모
에 대한
- React SVG 편집기는 웹 사이트, 애플리케이션, 로고 등을 만드는 데 도움이되는 강력한 디자인 도구입니다.
- 웹을 위해 제작 된 React SVG 편집기는 더 나은 디자인을 처음부터 끝까지 만들고 공유, 테스트 및 배송 할 수 있도록 도와줍니다.
- 도구를 통합하거나 워크 플로를 단순화하든 SVG 편집기는 모든 사람을 같은 페이지에 보관하면서 설계 프로세스를보다 빠르고 효율적이며 재미있게 만듭니다.
특징
- 디자인 레이아웃에 제공된 여러 도구.
- 그라디언트 제작자는 프로젝트 내에서 아름다운 그라디언트를 만들고 사용하도록 제공했습니다.
- 주제는 팔레트의 쉽게, 색상을 선택하고 저장하고, 프로젝트에서 전반적으로 사용하고, 색상을 좋아하지 않았으며, 변경하고, 사용 된 모든 요소에 자동으로 적용됩니다.
- 클립 아트 검색과 같은 도구, 그림 검색도 제공되었습니다.
- 모양을 쉽게 변환하고 높이, 너비, 테두리 색상, 배경색 등과 같은 다양한 속성을 조작하십시오.
- 8 개 이상의 CSS 필터를 사용할 수 있습니다.
- 대규모 프로젝트를 작은 부분으로 나누고 프로젝트의 별도 페이지로 설계하십시오.
- 프로젝트를 SVG 또는 JSON으로 내보내십시오.
- JSON 파일을 다시 손상 시키십시오
- 개요와 같은 효과, Box-Shadow도 사용할 수 있습니다.
- 모든 것이 로컬로 저장되며 인터넷이 작동 할 필요는 없습니다.
- 포인터 도우미는 또한 모양을 완벽한 위치에 놓을 수 있도록 제공됩니다.
사용 방법
- 헤더에서 새 파일 생성을 클릭하십시오
- 도구를 선택하십시오
- 캔버스를 클릭하여 모양을 추가하십시오
- 오른쪽의 사이드 바에는 모든 속성이 포함되어 있으며 거기에서 조작하십시오.
- 선, 다각형, 경로와 같은 다중 포인트 모양의 경우 오른쪽 클릭하여 경로를 끝내십시오.
- Ctrl 키를 누르고 모양을 스케일로 드래그하십시오.
- Shift 키를 누르고 모양을 드래그하여 회전합니다.
- 파일을 클릭 한 다음 페이지를 클릭하여 페이지를 추가하십시오.
- 파일을 클릭 한 다음 저장하여 프로젝트를 저장하십시오.
- 그라디언트를 클릭하면 그라디언트 생성 도구가 열립니다.
- 팔레트에 색상을 추가하려면 색상을 클릭하십시오.
- 삽입을 클릭하면 클립 아트 검색 도구가 열립니다.
당신이 얻는 모든 기능
- 내가 만든 가장 복잡한 프로젝트는 React SVG 편집기입니다. 브라우저 SVG 디자인 도구는 로고 디자이너, PPT, UI/UX 디자인 도구와 같은 많은 사용 사례가 있습니다. 프로젝트에서 검색 및 사용자 클립 아트 및 기타 기업, 필터, 그림자 등과 같은 효과를 추가하기위한 기타 도구가 있습니다.
- 원, 사각형, 타원, 텍스트, 라인, 플로이 라인, 다각형, 연필, 이미지 등과 같은 모양이 포함되어 있으므로이 앱을 열고 좋아하는 것을 설계 할 수 있습니다. 모든 디자인은 indexeddb라는 브라우저 데이터베이스에 저장됩니다.
- 또한 두 가지 모양을 함께 그룹화하여 제품 카드, 내비게이션 바, 따옴표 등과 같은 구성 요소를 만들 수 있으며 디자인을 통해 재사용 할 수 있습니다. 그룹 형태를 추가하기 위해 프로젝트를 다시 시작해야했습니다. 스크래치 브레이션에서 프로젝트를 다시 시작해야했습니다. 어레이에 모양을 저장하여 모양을 사용하여 맵에 요소를 저장해야했지만 Traversal Algorid의 렌더링을 렌더링해야했습니다.
- 디자인 프로젝트에 여러 페이지를 추가하고 나중에 파워 포인트 프레젠테이션처럼 실행할 수도 있습니다. -프로젝트는 react.js 및 redux를 사용하여 만들어졌으며 사용 된 언어는 TypeScript입니다.