VS Code заменяет разработчикам всё — текстовый редактор, часы, сайт знакомств, кухонный комбайн. С недавних пор его даже можно не устанавливать, потому что редактор полноценно работает и в браузере.

А теперь оказалось, что можно отказаться и от графического редактора — несложные картинки в проекте можно отредактировать прямо в VS Code. Да ещё так, как будто у вас стоит полноценный фотошоп или что-нибудь аналогичное.

Давайте посмотрим, что такое Luna Paint для VS Code, и как он справляется со своей единственной задачей — рисованием.

Как установить

Это обычное расширение из магазина VS Code, поэтому оно ставится одной кнопкой Install. Переходите на страницу расширения или найдите его в поиске у себя в VS Code и устанавливайте. Уже без перезагрузки начинается магия.

Установить Luna Paint — Image Editor

альт

Что здесь можно сделать

Любую картинку можно просто перетащить в редактор кода (!!!) и Luna Paint сразу откроет её в себе. Вы увидите меню, похожее на фотошоп или MS Paint, и сможете быстро что-то отредактировать.

альт

Из того, что сразу перед глазами — панель с небольшим, но достаточным набором, полноценная палитра, история операций и, самое удивительное, меню слоёв. То есть набор из хорошего растрового редактора, только встроенный в текстовый редактор.

Под кнопкой Menu прячется контекстная выпадайка, через которую можно делать практически всё — создавать файлы, перемещаться между слоями, вращать и отражать картинку, менять цвета или вызывать инструменты. Кстати, для всего настраиваются горячие клавиши, так что если вы не любите поднимать руки с клавиатуры, то это ваш выбор.

альт

Зачем это нужно, если есть фотошоп или фигма

Иногда в проектах оказываются маленькие картинки, иконки или фотографии, которые нужно быстро поправить, а исходника под рукой не оказалось. Например, нужно изменить размер или обрезать фотку, и для этого неудобно открывать тяжёлый графический редактор.

Luna Paint вполне может справиться с такими задачами, тем более, он умеет работать с выбранной рабочей областью или рабочей папкой. Вы буквально выбираете любой файл из списка, и если это картинка, то она сразу открывается для редактирования.

Класс же!

альт

А самая главная магия в том, что Luna Paint запускается и в браузерной версии VS Code, то есть вам не нужно устанавливать буквально ничего. Пригодится, если вы программируете для удовольствия на рабочем компьютере, куда нельзя ставить сторонние программы, но очень хочется что-нибудь изменить в жизни.

альт

Тест возможностей

Куда же без полноценного теста. Если с простыми задачами вроде обрезки Luna Paint справляется, то давайте посмотрим, справится ли он с настоящей работой. Обычно мы рисуем иллюстрации для блога в Фигме, но давайте попробуем сделать это в VS Code и узнаем, что получится.

Вот картинка для статьи про бэкенд, нарисованная в Фигме:

альт

А вот что получается после 15 минут попыток сделать то же самое. Вполне прилично, если не глядываться в детали.

альт

Итог

Конечно, статус Preview пока не позволяет лунапэинту делать многое — например, вы не можете повернуть текст на произвольный угол или изменить баланс белого и полутона у фотографии.

Но это, как оказалось, и не нужно. Luna Paint отлично справляется со своей задачей — быстро сделать что-нибудь с картинкой в проекте, который вы сейчас пилите, или вообще нарисовать что-то с нуля. Хорошее расширение, которое точно пригодится в хозяйстве.

Вердикт: рекомендуем хотя бы ознакомиться.

Как ещё поразвлекаться с Visual Studio Code: