Галерея Lorem Picsum

Lorem Picsum предоставляет бесплатные фотографии через простой API по URL: https://picsum.photos/{width}/{height} возвращает изображение любого размера. В этой галерее вы можете задать ширину, высоту, seed, радиус размытия и оттенки серого, а затем скопировать готовый к вставке URL (или тег <img>). Это позволяет вставлять фотографические заглушки прямо в Figma, в представление Blade или в компонент React, не тратя время на поиск стоковых изображений.

Как пользоваться галереей

  1. 1

    Задайте размеры изображения

    Ширина и высота в пикселях. Распространённые размеры, например 800×600 или 1200×630, доступны в виде пресетов.

  2. 2

    Выберите модификаторы

    Размытие (0–10), оттенки серого, фиксированный seed для воспроизводимых изображений, формат WebP или JPEG.

  3. 3

    Просмотрите сетку предпросмотра

    Загружается несколько случайных образцов, чтобы вы могли выбрать понравившийся.

  4. 4

    Скопируйте URL

    Возьмите обычный URL, полный тег `<img>` или синтаксис изображения в Markdown.

Строение URL

Базовая конечная точка:

https://picsum.photos/{width}/{height}

Плюс необязательные части запроса и пути:

Вариант Пример Эффект
Сокращение для квадрата /200 → то же, что /200/200 Квадратное изображение
Фиксированный seed /seed/cat/400/300 Всегда возвращает одно и то же фото
Конкретный ID фотографии /id/237/400/300 Закрепляет изображение 237 из коллекции
Оттенки серого /400/300?grayscale Монохромный фильтр
Размытие /400/300?blur=5 Размытие по Гауссу, 1–10
Формат /400/300.webp Принудительно задаёт формат файла
Случайное при каждой загрузке Только URL Новое фото при каждом обновлении

Когда использовать вместо настоящих стоковых фото

  • Хорошо: вайрфреймы, ревью дизайна, внутренние демо, тестовые фикстуры, эксперименты с ленивой загрузкой.
  • Плохо: боевые маркетинговые сайты, главные (hero) изображения, превью для соцсетей. Использовать чужой бесплатный сервис изображений через прямые ссылки для реального трафика, дурной тон и ненадёжно: фото может смениться без предупреждения.

Советы

  • Закрепляйте seed, когда делаете скриншоты макетов для документации; иначе изображение изменится, как только кто-то откроет страницу в следующий раз.
  • Подбирайте соотношения сторон для финальных ассетов (16:9, 4:5, 1:1), чтобы вёрстка не «прыгала» при замене на настоящие фото.
  • Используйте размытие для проверки перехода от заглушки к реальному изображению (паттерны LQIP), размытый вывод Picsum имитирует, как выглядела бы заглушка низкокачественного изображения.
  • Запрашивайте WebP для более лёгких страниц во время разработки.

Часто задаваемые вопросы

Технически фотографии распространяются по лицензии Unsplash, однако прямые ссылки (хотлинкинг) на picsum.photos из продакшена не рекомендуются: используйте сервис для прототипов, а для продакшена скачивайте ассет (или берите его из оригинального источника на Unsplash).

Без seed или ID API возвращает случайное фото на каждый запрос. Чтобы закрепить изображение, используйте /seed/vashe-slovo/... или /id/123/....

Lorem Picsum, бесплатный сервис на Cloudflare с разумными ограничениями по частоте запросов. Для тяжёлых наборов тестов или нагрузочного тестирования скачайте локальную копию и раздавайте её со своего хоста.

Да, сервис работает только по HTTPS. Все сгенерированные URL начинаются с https://.

Только для миниатюр предпросмотра, которые загружаются напрямую с picsum.photos. Сама галерея не передаёт третьим сторонам никаких данных о выбранных вами размере или seed.

Сопутствующие инструменты

Справочная таблица ASCII

Полная таблица ASCII от 0 до 127 с десятичным, шестнадцатеричным, восьмеричным и двоичным представлением, а также записью числовых ссылок HTML, включая NUL, LF и DEL.

Справочник сочетаний клавиш

Ищите документированные сочетания по умолчанию для VS Code, Chrome и Bash с GNU Readline в macOS, Windows и Linux.

Справочник символов HTML

Справочник HTML-сущностей с поиском, их именованными и числовыми кодами, а также копированием специальных символов и знаков одним кликом.

Шпаргалка по Markdown

Практический справочник Markdown с настоящим предпросмотром и готовыми для копирования примерами заголовков, списков, таблиц, кода, ссылок, изображений и синтаксиса GFM.

Конвертер CMYK в RGB

Преобразуйте проценты CMYK в приблизительные значения RGB и Hex для быстрого экранного предпросмотра по стандартной формуле.

Счетчик FPS

Измерьте FPS браузера через requestAnimationFrame: сглаживание, минимальная и максимальная частота кадров, порог предупреждения и график по желанию. Работает локально, без загрузок и API.

Инструмент доступен на других языках