Редактор пиксель-арта

Бесплатный редактор пиксель-арта в браузере

Создавай спрайты для ретро-игр, эмодзи, иконки, аватарки и крошечные анимации в этом онлайн-редакторе пиксель-арта. В нём есть всё нужное и ничего лишнего: чёткая сетка от 16 × 16 до 128 × 128, палитра в духе классических 8-битных консолей, заливка, зеркальный режим для симметричных персонажей и лента кадров для анимации. Закончив, скачай чёткий PNG, анимированный GIF или готовый для игры спрайт-лист. Без аккаунта и водяных знаков.

Как рисовать пиксель-арт

1. Выбери размер холста. 16 × 16 идеален для иконок и предметов, 32 × 32 — для персонажей, а 64 × 64 и больше — для сцен.
2. Нарисуй контур тёмным цветом. Держи линии толщиной в один пиксель и избегай «двойных» углов.
3. Залей формы ведёрком, затем добавь более тёмный оттенок с одной стороны и более светлый — с другой для объёма.
4. Включи зеркало для лиц, персонажей и космических кораблей: рисуешь левую половину, а правая появляется сама.
5. Анимируй, дублируя кадр (⧉), меняя несколько пикселей и нажимая воспроизведение. Калька бледно показывает предыдущий кадр, чтобы всё выровнять.
6. Скачай PNG текущего кадра, зацикленный GIF всей анимации или спрайт-лист.

Советы по пиксель-арту

• Используй меньше цветов. Отличный пиксель-арт часто обходится всего 4–8 цветами. Ограниченная палитра выглядит чище и более «ретро».
• Выбери направление света. Реши, откуда падает свет (обычно сверху слева), и затеняй все предметы одинаково.
• Избегай «подушечного» затенения. Если равномерно затемнять все края, предметы выглядят плоскими и надутыми. Лучше затеняй сторону, противоположную свету.
• Убирай «лесенки». В изгибах держи ступеньки равномерными (3-2-1, а не 3-1-2), чтобы линии выглядели гладкими.
• Маленькие анимации творят чудеса. Моргание из двух кадров или прыжок из четырёх кадров на 6 к/с уже выглядят живыми.

Идеи для первого пиксель-арта

• Сердечко или монетка на сетке 16 × 16 — классический первый спрайт за пять минут.
• Своя аватарка на 32 × 32 с включённым зеркалом: нарисуй половину лица и получи симметричного персонажа.
• Моргающий кот: два кадра, глаза открыты и закрыты, воспроизведение 4 к/с.
• Вращающаяся звезда: четыре кадра, каждый чуть повёрнут, экспорт в GIF для чата или соцсетей.
• Набор тайлов для игры: тайлы травы, воды и камня рядом, экспорт спрайт-листом.

PNG, GIF или спрайт-лист: что скачать?

PNG сохраняет кадр, на который ты смотришь, увеличенным с чёткими краями и прозрачным фоном — лучший выбор для аватарки, стикера или печати. GIF сохраняет всю анимацию зацикленной картинкой, которая играет почти везде, включая мессенджеры и сайты; он поддерживает до 255 цветов — гораздо больше, чем обычно нужно пиксель-арту. Спрайт-лист — один PNG со всеми кадрами в ряд, именно его ждут игровые движки вроде Godot, Unity, GameMaker и Phaser для анимации спрайтов.

Сочетания клавиш

B — карандаш, E — ластик, G — заливка, I — пипетка, M — зеркало, пробел — воспроизведение или пауза, Ctrl+Z — отменить, Ctrl+Y — повторить. Правая кнопка мыши стирает, какой бы инструмент ни был выбран, поэтому исправлять ошибки очень быстро.

Ещё творческие инструменты

Предпочитаешь плавные мазки кистью? Воспользуйся бесплатной онлайн-доской для рисования или создавай симметричные работы в «Конструкторе мандал». Для испытания проверь свою точность в «Нарисуй идеальный круг».