БлогNot. Онлайн-генераторы фонов для сайта

Онлайн-генераторы фонов для сайта

Background - один из самых бесполезных и назойливых элементов дизайна сайта. Поэтому мы его лепим первым делом, когда ещё нет ни концепции, ни наполнения, ни дизайна :)

Вот и мне понадобились. Везде, в общем, одни и те же ссылки. Я свою задачу решил с помощью первой из представленных, красивые клетки в стиле "шотландки".

 Генерирует клетчатые бэки :) Красивый дизайн, оригинальный выход

пример узора с tartanmaker.com
пример узора с tartanmaker.com

 А здесь полосатики онлайн

 Ещё одна полосатость

 Полосатик... правда, можно выбрать вертикальный или горизонтальный тип линий и формат файла

 Генератор "точечных" бэков из кружочков, неплохо

 Генератор на основе паттернов, "однокликочный"

 Генератор фонов из картинок. Работает только с SVG Media

 А здесь паттерны и фоновый цвет

 Вертикальные полосы с выбором разрешения, вводом hex-кодов цветов и рандомайзером

 Ещё один генератор, есть выбор формата картинки

 Очень навороченный генератор, много параметров и возможностей

 Есть установки прозрачности, типа заполнения, размера картинки

 На основе паттернов

 Оригинально - рисуем паттерн по квадратиком, потом заполняем им фон (превью) и можем сохранить файл

 Ява-апплет для простых паркетов, можно менять форму заготовки мышкой

 Ещё создание и раскраска простых паркетов онлайн

Вот ещё, возможны дубли ссылок или "мёртвые" ссылки.

Генераторы фонов:
http://www.stripegenerator.com/ - Один из самых известных "генераторов полос".
http://www.stripemania.com/ - Для поклонников полосок.
http://www.tartanmaker.com/ - Генерирует достаточно необычные узоры.
http://www.ogim.4u2ges.com/gradient-image-maker.asp - Хороший редактор фона.
http://secretgeek.net/GradientMaker.asp - Простой редактор фоновых подложек.
http://lab.rails2u.com/bgmaker/ - фон из вашей картинки
http://www.tilemachine.com/ - Редактор + База фонов.
http://bgmaker.ventdaval.com/ - Пиксельный редактор в реальном времени. (удобно)
http://bgpatterns.com/ - Фоны из иконок.
http://www.colourlovers.com/patterns/add - Редактор красивых фонов
http://stripedbgs.com/ - Очень простой редактор фонов
http://www.pixelknete.de/dotter/ - Редактор с просмотром фона
http://mudcu.be/bg/ - цветной генератор
http://repperpatterns.com/tool/ - мультяшные фоны
http://tools.dynamicdrive.com - в основном, градиенты, но есть и другие некоторые возможности онлайн

Базы готовых фонов:
http://www.patterncooler.com/ - Отличный выбор фонов.
http://www.dinpattern.com/ - База фонов.
http://patterns.ava7.com/ - Удобная база с фильтром цветам и узорам.
http://thedesigninspiration.com/category/patterns/ - Большая база фонов.
http://browse.deviantart.com/resources/applications/patterns/ - Есть интересные фоны.
http://www.colourlovers.com/patterns - База "бесконечных" фонов.
http://everydayicons.jp/patterns.html - Небольшая подборка хороших фонов.
http://www.squidfingers.com/patterns/ - Бесконечные узорные фоны.
http://alice-grafixx.de/patterns - База разнообразных фонов.
http://www.kollermedia.at/pattern4u/ - Фоны по жанрам узоров.
http://donbarnett.com/tiles/tile.htm - Оригинальный сайт с оригинальными фонами.
http://www.pixeldecor.com/patterns.shtml - Небольшая подборка фонов.
http://patterrific.com/category/patterns/ - База Бэкграундов
http://www.noqta.it/dromoscopio/ - База фонов для сайта
http://www.portfelia.com/ - база фонов
http://www.brusheezy.com/patterns - Backgorund для сайты
http://www.stm.dp.ua/web-design/color-site.html - Однотонный цветовой фон
http://subtlepatterns.com/ - хороший набор паттернов
http://hotbliggityblog.com/ - фоны для блогов
http://patternhead.com/ - небольшая база фонов
http://lostandtaken.com/gallery - Платные и Бесплатные фоны
http://www.grsites.com/archive/textures/ - Free Background Textures Library - Бесплатная библиотека фоновых текстур
http://webtreats.mysitemyway.com/ - подборка бесшовных фонов

Background в CSS

Свойство background позволяет установить одновременно до пяти характеристик фона: background: [background-attachment || background-color || background-image || background-position || background-repeat] | inherit

background-attachment - привязка. По умолчанию задано scroll - фон перемещается при прокрутке вместе со страничкой. Можно зафиксировать его, задав fixed.

background-color - цвет фона. Выбирается из обычной палитры цветов;

background-image - картинка для фона. Указывается адрес файла изображения;

background-position - расположение фонового рисунка: в центре, слева, справа, снизу или сверху.

background-repeat - повторение выбранной картинки.

background-size, появившееся в css3. позволяет растянуть фоновое изображение до нужного размера (можно задавать значения в пикселях, в процентах от контейнера, чьим фоном оно является, "уместить" его в данный контейнер (cover), а также растянуть по высоте или ширине контейнера (contain).

Горизонтальный рисунок, растянутый по верху страницы, как в этом блоге, называется шапка блога (Blog Headers).

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

В идеале швы "завариваются" со всех сторон, но если картинка тянется по горизонтали, можно сделать это только слева и справа.

Вариация на тему флага РФ :)
Вариация на тему флага РФ :)

03.07.2010, 22:22 [13707 просмотров]


теги: css графика random ссылки сервис вебдезигн

показать комментарии (1)