React SVG редактор
Библиотека SVG не используется, построена с нуля
Для любого запроса на функцию пинг меня в LinkedIn?
Следуйте за мной на LinkedIn для более интересных проектов
Нажмите здесь, чтобы посетить сайт
Демо
О
- React SVG Editor - это мощный инструмент проектирования, который помогает вам создавать что -либо: веб -сайты, приложения, логотипы и многое другое.
- Редактор React Svg, созданный для веб -сайта, помогает вам создавать, делиться, тестировать и отправлять лучшие проекты от начала до конца.
- Будь то консолидация инструментов или упрощение рабочих процессов React SVG редактор делает процесс проектирования быстрее, более эффективным и веселым, сохраняя при этом всех на одной странице.
Функции
- Несколько инструментов, предоставленных для проектирования макетов.
- Градиент создатель предоставил для создания и использования красивых градиентов в рамках проекта.
- Тема, сделанная легкой, выбирать и сохранять цвета в палитре и использовать их на протяжении всего проекта, не нравилась цвет, изменил его, он автоматически будет применен ко всем элементам, в которых он использовался.
- Инструмент, такой как поиск клипарт, поиск иллюстрации также предоставлен.
- Легко преобразовать формы, манипулируя различными свойствами, такими как высота, ширина, цвет границы, цвет фона и т. Д.
- Доступно более 8 фильтров CSS.
- Разделите большие проекты на небольшие детали, разработайте их на отдельных страницах проекта.
- Экспортируйте свой проект как SVG или JSON.
- Еще раз импровизируйте файл JSON
- Эффекты, такие как наброски, также доступны.
- Все сохраняется на месте, не нужен интернет для работы
- Помощники указателей также предоставляются, чтобы помочь поместить вашу форму в идеальном положении.
Как использовать
- Нажмите на создание нового файла в заголовке
- Выберите инструмент
- Нажмите на холст, чтобы добавить форму
- Боковая панель справа содержит все свойства, манипулируя ими оттуда.
- Для множественных форм, таких как линия, многоугольник, используйте правой кнопкой мыши, чтобы завершить путь.
- Нажмите клавишу CTRL и перетащите форму в масштабе.
- Нажмите клавишу Shift и перетащите форму, чтобы повернуть.
- Нажмите на файл, затем на страницах, чтобы добавить больше страниц.
- Нажмите на файл, а затем сохранение, чтобы сохранить свой проект.
- Нажмите на градиент, инструмент создания градиента откроется для вас.
- Нажмите на цвет, чтобы добавить цвета в палитру.
- Нажмите на вставку, для вас откроется поисковый инструмент Clipart.
Какие функции вы получаете
- Самый сложный проект, который я создал, - это React SVG Editor, это инструмент в дизайне SVG в браузере, в котором есть много вариантов использования, таких как дизайнер логотипа, PPT, инструмент дизайна UI/UX, встроенные компоненты для поиска и пользовательского клипса в ваших проектах и других инструментах для добавления таких эффектов, градиенты, фильтры, тени и т. Д.
- Он включает в себя такие формы, как круг, прямоугольник, эллипс, текст, линия, линия планы, многоугольник, карандаш, изображение и т. Д., Вы можете просто открыть это приложение и начать проектирование того, что вам нравится, все проекты будут сохранены в базе данных браузера под названием IndexedDB.
- Вы также можете группировать две формы вместе и, таким образом, создать компонент, такой как карта продукта, навигационная панель, цитаты и т. Д., И повторно используйте их в ваших дизайнах, чтобы добавить групповую форму, я должен был снова запустить проект с нуля, я использовал линейный обход, сохраняя формы в массиве для визуализации форм, но с группами не было возможно, поэтому я должен был хранить элементы в карте и развеять их, используя их, сначала повернувшись.
- Вы также можете добавить несколько страниц в свой проектный проект, а затем запустить его как презентация Power Point. -Опэдж изготовлен с использованием React.js и Redux, а язык используется TypeScript.
