Редактирование изображений со слоями: вручную или через API.

Настоящий редактор слоёв, а не заполнитель шаблонов

Большинство API для генерации баннеров подставляют текст и картинку в готовый дизайн. Nordic Layers даёт инструменты настольного графического редактора, и каждый из них — вызов API.

• Слои и режимы наложения

  Слои изображения, текста, фигуры, заливки цветом, линейного или радиального градиента и корректирующие слои. Двадцать режимов наложения, от умножения и экрана до мягкого света, цветности и яркости, и непрозрачность у каждого слоя.

• Неразрушающие коррекции

  Уровни, кривые, цветовой тон/насыщенность, экспозиция, яркость/контраст, карта градиента, чёрно-белое, цветовой баланс, инверсия и зерно. Меняйте или убирайте их когда угодно: исходные пиксели не затрагиваются.

• Маски и обтравка

  Маски слоя из прямоугольника, эллипса, градиентного перехода или другого изображения, с растушёвкой и инверсией. Обрежьте фото по фигуре под ним, как в настольном редакторе.

• Текст на любой письменности

  Арабский и урду справа налево, хинди, бенгальский и тамильский с правильным начертанием, китайский, японский и корейский. Ширина блока, выравнивание, интерлиньяж, полужирный и курсив в 12 семействах шрифтов.

• Фильтры и эффекты слоёв

  Размытие по Гауссу и в движении, шум, виньетирование, резкость и пикселизация. Тень, обводка, внешнее свечение и наложение цвета на любой слой, включая текст.

• Один документ, два способа работы

  То, что вы собираете в браузерном редакторе, — это JSON-документ, который API может открыть, изменить и экспортировать, и наоборот. Дизайнеры рисуют шаблон, код его заполняет.

Примеры, отрисованные настоящим движком

Каждое изображение ниже получено движком Nordic Layers из JSON рядом с ним. Фотографии тестовые; asset_id — это ID, который POST /v1/assets возвращает для каждой загрузки.

• 

  Холст 1200×628 · 8 слоёв

  Баннер товара для интернет-магазина

  Фото товара с тенью на градиенте, ценник и предложение. Меняйте изображение и текст для каждого товара каталога и экспортируйте всё одним скриптом.

  Показать JSON, из которого оно получено

  // POST /v1/projects
  {
    "name": "Serum banner",
    "width": 1200,
    "height": 628,
    "background": "#F4EDE4",
    "steps": [
      {"op": "layer.addFill", "name": "Backdrop", "gradient": {"colors": ["#F7F1E8", "#E6D6C1"], "angle": 0}},
      {"op": "shape.add", "shape": "ellipse", "rect": [700, 64, 500, 500], "color": "#DCC5A6", "name": "Disc"},
      {"op": "layer.addImage", "asset_id": "serum_bottle", "rect": [806, 70, 288, 480], "fit": "contain", "name": "Product"},
      {"op": "effects.set", "layer": "Product", "shadow": {"color": "#3B2A1A", "opacity": 0.35, "angle": 120, "distance": 22, "size": 34}},
      {"op": "text.add", "content": "Vitamin C serum", "fontName": "Georgia", "fontSize": 66, "bold": true, "color": "#2B2118", "origin": [72, 150], "name": "Title"},
      {"op": "text.add", "content": "Brightening daily formula · 30 ml", "fontName": "Segoe UI", "fontSize": 30, "color": "#6B5A4A", "origin": [75, 245], "name": "Subtitle"},
      {"op": "shape.add", "shape": "rectangle", "rect": [72, 340, 300, 84], "cornerRadius": 42, "color": "#1E3A5F", "name": "Badge"},
      {"op": "text.add", "content": "−30% this week", "fontName": "Segoe UI", "fontSize": 34, "bold": true, "color": "#FFFFFF", "alignment": "center", "boxWidth": 300, "origin": [72, 357], "name": "Offer"},
      {"op": "text.add", "content": "Free delivery from €30", "fontName": "Segoe UI", "fontSize": 24, "color": "#6B5A4A", "origin": [75, 460], "name": "Note"}
    ]
  }

• 

  Холст 1080×1080 · 5 слоёв

  Квадратный пост для соцсетей

  Фото с уровнями, насыщенностью и виньетированием, тёмная заливка с градиентной маской, чтобы заголовок читался на любой картинке.

  Показать JSON, из которого оно получено

  // POST /v1/projects
  {
    "name": "Weekend guide post",
    "width": 1080,
    "height": 1080,
    "background": "#0B1F33",
    "steps": [
      {"op": "layer.addImage", "asset_id": "photo_lake", "fitCanvas": "cover", "name": "Photo"},
      {"op": "adjust.levels", "layer": "Photo", "black": 8, "white": 245, "gamma": 1.05},
      {"op": "adjust.hueSaturation", "layer": "Photo", "saturation": 18},
      {"op": "filter.vignette", "layer": "Photo", "amount": -35, "midpoint": 55, "feather": 60},
      {"op": "layer.addFill", "color": "#0B1F33", "name": "Shade", "opacity": 0.9},
      {"op": "mask.add", "layer": "Shade", "from": [540, 1080], "to": [540, 560]},
      {"op": "text.add", "content": "WEEKEND GUIDE · ISSUE 12", "fontName": "Segoe UI", "fontSize": 28, "bold": true, "color": "#9CC7EC", "origin": [84, 724], "name": "Kicker"},
      {"op": "text.add", "content": "Slow mornings\nby the lake", "fontName": "Georgia", "fontSize": 92, "color": "#FFFFFF", "leading": 1.05, "origin": [80, 770], "name": "Headline"},
      {"op": "shape.add", "shape": "line", "from": [86, 1000], "to": [300, 1000], "color": "#FFFFFF", "lineWidth": 4, "name": "Rule"}
    ]
  }

• 

  Холст 1080×1920 · 7 слоёв

  Сторис на арабском

  Сторис 9:16 с арабским текстом справа налево, размытым фоном и фото, обрезанным по карточке со скруглёнными углами обтравочной маской.

  Показать JSON, из которого оно получено

  // POST /v1/projects
  {
    "name": "Sale story (Arabic)",
    "width": 1080,
    "height": 1920,
    "background": "#120A1E",
    "steps": [
      {"op": "layer.addImage", "asset_id": "photo_ribbons", "fitCanvas": "cover", "name": "Backdrop"},
      {"op": "filter.gaussianBlur", "layer": "Backdrop", "radius": 28},
      {"op": "adjust.brightnessContrast", "layer": "Backdrop", "brightness": -20, "contrast": -10},
      {"op": "shape.add", "shape": "rectangle", "rect": [90, 230, 900, 1000], "cornerRadius": 48, "color": "#FFFFFF", "name": "Card"},
      {"op": "effects.set", "layer": "Card", "shadow": {"color": "#000000", "opacity": 0.55, "angle": 90, "distance": 24, "size": 60}},
      {"op": "layer.addImage", "asset_id": "photo_ribbons", "rect": [90, 230, 900, 1000], "fit": "cover", "name": "Photo"},
      {"op": "layer.clip", "layer": "Photo"},
      {"op": "text.add", "content": "تخفيضات نهاية الموسم", "fontName": "Segoe UI", "fontSize": 92, "bold": true, "color": "#FFFFFF", "alignment": "right", "boxWidth": 900, "origin": [90, 1310], "name": "Headline"},
      {"op": "text.add", "content": "خصم حتى ٤٠٪ على المجموعة كاملة", "fontName": "Segoe UI", "fontSize": 50, "color": "#E9D8FF", "alignment": "right", "boxWidth": 900, "origin": [90, 1460], "name": "Offer"},
      {"op": "shape.add", "shape": "rectangle", "rect": [610, 1610, 380, 110], "cornerRadius": 55, "color": "#FFFFFF", "name": "Button"},
      {"op": "text.add", "content": "تسوّق الآن", "fontName": "Segoe UI", "fontSize": 46, "bold": true, "color": "#120A1E", "alignment": "center", "boxWidth": 380, "origin": [610, 1628], "name": "Button label"}
    ]
  }

• 

  Холст 1280×720 · 4 слоёв

  Превью для видео

  Крупный шрифт с обводкой и тенью поверх отражённого, увеличенного и осветлённого фото, и повёрнутая плашка. Такое превью вы делаете каждую неделю.

  Показать JSON, из которого оно получено

  // POST /v1/projects
  {
    "name": "Tutorial thumbnail",
    "width": 1280,
    "height": 720,
    "background": "#0D1117",
    "steps": [
      {"op": "layer.addImage", "asset_id": "photo_glow", "fitCanvas": "cover", "name": "Photo"},
      {"op": "transform.flip", "layer": "Photo", "axis": "horizontal"},
      {"op": "transform.scale", "layer": "Photo", "factor": 1.4},
      {"op": "transform.move", "layer": "Photo", "dx": 240},
      {"op": "adjust.exposure", "layer": "Photo", "exposure": 0.4},
      {"op": "text.add", "content": "COLOUR\nGRADING", "fontName": "Impact", "fontSize": 168, "leading": 0.98, "color": "#FFFFFF", "origin": [70, 110], "name": "Title"},
      {"op": "effects.set", "layer": "Title", "stroke": {"color": "#0D1117", "size": 10, "position": "outside"}, "shadow": {"color": "#000000", "opacity": 0.7, "angle": 120, "distance": 14, "size": 20}},
      {"op": "shape.add", "shape": "rectangle", "rect": [70, 520, 470, 92], "cornerRadius": 14, "color": "#FFCC00", "name": "Tag"},
      {"op": "transform.rotate", "layer": "Tag", "angle": -3},
      {"op": "text.add", "content": "IN 5 MINUTES", "fontName": "Impact", "fontSize": 66, "color": "#0D1117", "alignment": "center", "boxWidth": 470, "origin": [70, 526], "name": "Tag text"},
      {"op": "transform.rotate", "layer": "Tag text", "angle": -3}
    ]
  }

• 

  Холст 1200×630 · 7 слоёв

  Превью ссылки Open Graph

  Карточка 1200×630 для статьи: градиентный фон, фото с градиентной маской и корректирующий слой «карта градиента» поверх всего.

  Показать JSON, из которого оно получено

  // POST /v1/projects
  {
    "name": "Blog link preview",
    "width": 1200,
    "height": 630,
    "background": "#1E3A5F",
    "steps": [
      {"op": "layer.addFill", "name": "Backdrop", "gradient": {"colors": ["#24476F", "#0F2238"], "angle": 120}},
      {"op": "layer.addImage", "asset_id": "photo_shore", "rect": [560, 0, 640, 630], "fit": "cover", "name": "Photo"},
      {"op": "mask.add", "layer": "Photo", "from": [900, 315], "to": [580, 315]},
      {"op": "adjustmentLayer.add", "kind": "gradientMap", "shadows": "#0F2238", "highlights": "#E8F1FA", "name": "Duotone", "opacity": 0.35},
      {"op": "text.add", "content": "THE NORDIC NOTEBOOK", "fontName": "Segoe UI", "fontSize": 24, "bold": true, "color": "#64B5F6", "origin": [72, 96], "name": "Kicker"},
      {"op": "text.add", "content": "Five quiet lakes for a long weekend", "fontName": "Georgia", "fontSize": 62, "color": "#FFFFFF", "boxWidth": 560, "leading": 1.12, "origin": [70, 150], "name": "Title"},
      {"op": "shape.add", "shape": "ellipse", "rect": [72, 470, 64, 64], "color": "#64B5F6", "name": "Avatar"},
      {"op": "text.add", "content": "A. Writer · 6 min read", "fontName": "Segoe UI", "fontSize": 26, "color": "#D6E2EF", "origin": [156, 484], "name": "Byline"}
    ]
  }

• 

  Холст 1080×1080 · 5 слоёв

  Один шаблон, любой язык

  Один проект, четыре экспорта. В каждом вызове экспорта два шага text.set, поэтому английский, испанский, хинди и японский получаются из одного дизайна без сохранения копий.

  Показать JSON, из которого оно получено

  // POST /v1/projects
  {
    "name": "Collection launch",
    "width": 1080,
    "height": 1080,
    "background": "#1E3A5F",
    "steps": [
      {"op": "layer.addImage", "asset_id": "photo_dunes", "fitCanvas": "cover", "name": "Photo"},
      {"op": "adjustmentLayer.add", "kind": "gradientMap", "shadows": "#1E3A5F", "highlights": "#F6E7D8", "name": "Brand tone", "opacity": 0.55},
      {"op": "layer.addFill", "color": "#0F2238", "name": "Shade", "opacity": 0.75},
      {"op": "mask.add", "layer": "Shade", "from": [540, 0], "to": [540, 520]},
      {"op": "text.add", "content": "New collection", "fontName": "Segoe UI", "fontSize": 96, "bold": true, "color": "#FFFFFF", "alignment": "center", "boxWidth": 960, "origin": [60, 120], "name": "Title"},
      {"op": "text.add", "content": "Available from 1 November", "fontName": "Segoe UI", "fontSize": 54, "bold": true, "color": "#D6E2EF", "alignment": "center", "boxWidth": 960, "origin": [60, 250], "name": "Subtitle"}
    ]
  }
  
  // POST /v1/projects/{id}/export  (es)
  {
    "format": "webp",
    "steps": [
      {"op": "text.set", "layer": "Title", "content": "Nueva colección"},
      {"op": "text.set", "layer": "Subtitle", "content": "Disponible desde el 1 de noviembre"}
    ]
  }
  
  // POST /v1/projects/{id}/export  (hi)
  {
    "format": "webp",
    "steps": [
      {"op": "text.set", "layer": "Title", "content": "नया कलेक्शन"},
      {"op": "text.set", "layer": "Subtitle", "content": "1 नवंबर से उपलब्ध"}
    ]
  }
  
  // POST /v1/projects/{id}/export  (ja)
  {
    "format": "webp",
    "steps": [
      {"op": "text.set", "layer": "Title", "content": "新コレクション"},
      {"op": "text.set", "layer": "Subtitle", "content": "11月1日から発売"}
    ]
  }

Для чего это подходит

• Пакетные изображения товаров

  Баннеры и картинки каталога для каждого товара: один шаблон, фото и цена товара подставляются скриптом.

• Посты и сторис для соцсетей

  Посты и сторис на любых языках из одного дизайна, с правильным начертанием текста на арабском, хинди или японском.

• Превью для видео

  Шаблон превью для каждого канала или серии: меняйте заголовок и фото, сохраняя стиль.

• Изображения Open Graph

  Карточки предпросмотра ссылок, которые создаются при публикации страницы, с заголовком статьи.

• Маркетинговые варианты для каждой локали

  Одна кампания на каждом рынке: переведённый текст, местные цены, другое фото, всё из одного проекта.

• Агенты и автоматизация

  n8n, Make, Zapier, скрипт cron или ИИ-агент: всё, что умеет отправить HTTP-запрос с JSON, может редактировать изображения.

• Редактирование в браузере

  Отретушировать фото, собрать макет или поправить шаблон вручную, когда нужно, не устанавливая редактор.

Тарифы и цены

Начните бесплатно, без карты. Предпросмотры всегда бесплатны; считаются только экспорты. Цены без НДС, счета выставляются в фунтах в Великобритании и в евро в остальных странах.

• Free

  0 € в месяц

  Бесплатно, без карты

  • 50 рендеров в месяц
  • Холст до 4 мегапикселей
  • До 10 слоёв в проекте
  • Сохранённых проектов: 3
  • Хранилище: 250 MB
  • Экспорты хранятся 3 дней
  • Ключей API: 1
  • Одновременных рендеров: 1
  • Небольшой водяной знак на экспортах
  Начать бесплатно

• Starter

  19 € в месяц

  £17 UK

  • 1,000 рендеров в месяц
  • Холст до 12 мегапикселей
  • До 30 слоёв в проекте
  • Сохранённых проектов: 50
  • Хранилище: 2 GB
  • Экспорты хранятся 14 дней
  • Ключей API: 2
  • Одновременных рендеров: 2
  • Без водяного знака
  Выбрать Starter

• Pro

  49 € в месяц

  £43 UK

  • 5,000 рендеров в месяц
  • Холст до 25 мегапикселей
  • До 100 слоёв в проекте
  • Сохранённых проектов: 500
  • Хранилище: 10 GB
  • Экспорты хранятся 30 дней
  • Ключей API: 5
  • Одновременных рендеров: 4
  • Без водяного знака
  Выбрать Pro

• Business

  129 € в месяц

  £112 UK

  • 20,000 рендеров в месяц
  • Холст до 50 мегапикселей
  • До 200 слоёв в проекте
  • Сохранённых проектов: 5,000
  • Хранилище: 50 GB
  • Экспорты хранятся 60 дней
  • Ключей API: 20
  • Одновременных рендеров: 8
  • Без водяного знака
  • Приоритетный рендеринг
  Выбрать Business