Создание полосатого фона для сайта

Фон для сайта может внести в дизайн некую изюминку — будь то деревянный паркет, красивые узоры или что-то в этом роде. Удачно подобранный backgorund позволит вашему проекту выглядеть ярко и стильно. Я уже однажды говорил о том как задать фон для сайта через свойство CSS backgorund, теперь самое время рассказать о картинках, которые для этого фона можно использовать. Они, кстати, должны выглядеть так, чтобы при заполнении всего экрана изображение смотрелось цельно, без глюков, то есть узор должен определенным образом повторяться.

В сети есть около десятка сервисов (а может и больше), которые помогут вам сгенерировать правильный фон, задавая лишь некоторые его параметры — цвет, узор и т.п. Если у вас нет желания вникать во все азы Photoshop`а — воспользуйтесь одним из сайтов ниже.

Stripe Generator

Stripe Generator - генераток фона для сайта

Дословно название Stripe Generator переводится как «генератор полос» — в принципе, его оправдывает на все 100%. Вы можете выбрать расположение полос, расстояние между ними, их ширину, цвет, наличие тени — в общем, практически все:

сервис генератор background

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

StripeMania

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

фон background для сайта / блога

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

Tartanmaker

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

красивый фон для сайта

На первый взгляд, данный фон очень неплохо смотрелся бы на ретро сайте (особенно с применением винтажных кистей для Photoshop).

P.S. Если у вы ведете тематический блог о дизайне — предлагаю обменяться постовыми.

16 комментариев к статье “Создание полосатого фона для сайта”
  1. Из первых дувух я бы не выбрал лучшего. По крайней мере сразу..

  2. Tod

    WebMast, у них и возможности слегка отличаются.

  3. Anton

    Полезные сервисы

  4. KH93b

    Спасибо! Искал то, что нужно было. Сэкономил немного времени.

  5. Второй сервис как мне кажется намного лучше.
    Хотя на вкус и на цвет все фломастеры разные))))

  6. TOE-MAY-TOE

    большое спасибо!!! отличные сервисы долго искал чтото подобное

  7. Хорошая подборка.
    Можно еще к этому списку добавить — http://bgpatterns.com/

  8. ОГОГО! Я чуть не кончил от результатов их работы, спасибо!

  9. Юрий

    Все это делается в фотошопе Экшенами за две минуты.

  10. Пирожок с тестом

    2 Юрий. Не совсем обязательно овладевать фотошопом, чтоб склепать паттерн на фон сайта))

  11. То что нужно! Спасибо большое!

  12. Спасибо

    Спасибо супер! То что искал.

  13. Victoribu

    Полезная информация. Добавьте пожалуйста сервис для создания фона в виде матрицы, а то не получается найти.

  14. Спасибо! Действительно полезные сервисы.
    А тому кто пишет «Все это делается в фотошопе Экшенами за две минуты» хочется дать пинка! Зачем ковыряться 2 и более минуты в фотошопе если через вышеописанные сервисы это можно сделать за полминуты. К тому же далеко не все знают фотошоп и не всем нравится в нем ковыряться. Например я стараюсь им пользоваться только в самых крайних случаях, когда без него никак.

  15. Оксана

    Хорошие сервисы. Можно и фотошоп знать, и иногда побаловаться «автоматизацией». Почему бы и нет?

  16. Марина

    Tartanmaker интересный сервис. Можно использовать. А первые два — ни о чем. Хотя я больше за минимализм. Фоны сильно отвлекают

Оставить комментарий

Внимание! Если вы комментируете впервые, текст будет отправлен на модерацию.
Ваш e-mail не публикуется. Обязательные поля помечены *