Генератор CSS-паттернов
Создайте бесшовный фоновый паттерн из чистых CSS-градиентов, без файла изображения, и скопируйте CSS.
Как это работает
Каждый пресет строит один или два слоя CSS linear-gradient() или
radial-gradient() с жёсткими цветовыми переходами (без плавного смешивания
между ними) — именно это превращает плавный градиент в чёткую повторяющуюся форму.
background-size задаётся ровно по размеру одного тайла, чтобы паттерн
повторялся без видимого шва по краям, а паттерны «точки» и «сетка» дополнительно смещают
background-position, чтобы фигуры оказывались по центру, а не обрезались по углу.
Всё это — сгенерированный CSS, применённый к собственному стилю background
блока предпросмотра. Ничего не загружается, и запрос изображения не выполняется.
Частые вопросы
Используется ли файл изображения?
Нет, каждый паттерн строится из CSS-градиентов, наложенных как повторяющийся фон, без единого запроса изображения. Это сохраняет чёткость паттерна при любом масштабе и размере элемента, поскольку это векторная математика, а не растровый тайл.
Паттерн будет повторяться бесшовно?
Да, background-size задаётся ровно как один повторяющийся блок, поэтому паттерн повторяется край в край без видимого шва при любом размере элемента.
Отправляется ли это куда-либо?
Нет, паттерн генерируется и предпросматривается полностью в CSS-движке вашего браузера. Ничего не загружается.