Создание сайта/блога на WordPress — что может быть проще!
Идеальная палитра цветов для сайта ТОП6 сервиса
Рубрика: Все для вебмастера

Идеальная палитра цветов для сайта ТОП6 сервиса

26 комментариев   

Приветствую Вас! На связи с Вами снова Владимир Савельев. Сегодня статья будет ориентирована в основном на новичков. Именно на начальном этапе многие не могут «на глаз» сказать какая палитра цветов для сайта подойдет идеально?!

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

Читай так же:

Встречают по одежке, а провожают по уму, гласит всем известная народная поговорка. Тоже самое можно сказать и про сайты, созданные и расположенные в сети Интернет. Палитра цветов для сайта – это прежде всего цветовая гамма, которая присутствует на Вашем сайте. В основном, на сайтах присутствует основной цвет и далее к нему идут несколько вспомогательных цветов, которые улучшают восприятие информации.

Бывают сайты такие, заходишь на них и получаешь истинное удовольствие. Сразу же хочется нажать на кнопочку подписаться. А когда дочитал статью до конца – уходить не хочется, начинаешь просматривать название других статей, чтобы ознакомиться с их содержанием и еще хоть немножко получить моральное удовлетворение от изучаемого сайта.

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

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

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

Палитра цветов для сайта ТОП-6 сервиса

1. Начну я с обзора самого моего любимого сервиса — colorhexa.com.
Почему я начал именно с этого сервиса? Все просто, просто этот сервис действительно подойдет для самых ленивых пользователей. Однако, несмотря на свою простоту – этот сервис настоящая находка для веб-дизайнеров.

сервис подбора цвета для сайта

Тут все просто при работе – вводите цвет или несколько цветов для своего сайта – и сервер Вам самостоятельно подбирается палитру, какие цвета еще можно использовать с Вашими основными цветами. При этому свою цветовую палитру для сайта можно посмотреть в двух основных вариантах – в темных и светлых тонах – что очень даже неплохо скажется на первоначальном этапе.


2. Сервис Color Blender
Вот так название! Вы пользовались когда-нибудь блендером? Думаю, что да, потому как соки, мороженное, молочные коктейли и многое что еще – делаются именно в этой чудо-технике.

выбор цвета для сайта

Так и тут – название говорит само за себя. Очень аккуратный и удобный сервис тем, что можно перетаскивать ползунки вверх или вниз. И система сама изменяет выбранные цвета.
Для более опытных существует еще и ручной режим, когда Вы можете выбрать нужный цвет с помощью ручных настроек. В общем – рекомендую!


3. Сервис для палитры цветов сайта – Кулер от Адобе
Один из самых известных сервисов. На нем, Вы сможете не только подобрать цветовую гамму для сайта, но еще использовать рейтинг, который имеется на этом сервисе.
Рейтинг поможет Вам сориентироваться Вам, где цвета подобраны очень хорошо, где цвета подобраны так себе, а где цвета подобраны настолько плохо, что, как говорится, без слез и не взглянешь.


4. Сервис — Color Rotate
Очень мощный и по истине является одним из лидеров рынка. На сервисе есть все, что потребуется дизайнеру и даже намного больше.

Подбирать цвета для сайта

Подбирать цвета для сайта можно не прост ов обычном режиме, а даже в 3-D. По праву можно сказать, что этот сервис – для профессионалов дизайнеров, которые связали свою жизнь с веб-дизайном.


5 и 6. Еще стоит упомянуть об онлайн сервисах paletton.com и Сolor scheme designer, с их помощью Ваша палитра цветов для сайта будет идеальна!


Конечно, сервисов по подбору палитры цветов для сайта – очень много. Но те сервисы, которые были сегодня мною рассмотрены – этого вполне достаточно для решения вопроса о выборе цветовой гаммы. Изучите их и Ваша палитра цветов для сайта будет сверкать долгие годы и привлекать на Ваш сайт все новых и новых пользователей.

Программа подбора цвета для сайта

А Вы слышали про программу Color Browser, которая позволяет вам найти очень даже интересные цвета для своего сайта. Данная программа работает без Интернета. Вы ее скачиваете здесь и устанавливаете на свой ПК. Далее для работы Вам потребуется такая программа как Adobe AIR. Скачать данную программу можно здесь.

Стоит упомянуть так же, о таблице безопасных цветов… Они одинаково отображаются на любых мониторах!

Таблица безопасных цветов для сайта

255.255.204 255.255.153 255.255.102 255.255.51 255.255.0 204.204.0
FFFFCC FFFF99 FFFF66 FFFF33 FFFF00 CCCC00
255.204.102 255.204.0 255.204.51 204.153.0 204.153.51 153.102.0
FFCC66 FFCC00 FFCC33 CC9900 CC9933 996600
255.153.0 255.153.51 204.153.102 204.102.0 153.102.51 102.51.0
FF9900 FF9933 CC9966 CC6600 996633 663300
255.204.153 255.153.102 255.102.0 204.102.51 153.51.0 102.0.0
FFCC99 FF9966 FF6600 CC6633 993300 660000
255.102.51 204.51.0 255.51.0 255.0.0 204.0.0 153.0.0
FF6633 CC3300 FF3300 FF0000 CC0000 990000
255.204.204 255.153.153 255.102.102 255.51.51 255.0.51 204.0.51
FFCCCC FF9999 FF6666 FF3333 FF0033 CC0033
204.153.153 204.102.102 204.51.51 153.51.51 153.0.51 51.0.0
CC9999 CC6666 CC3333 993333 990033 330000
255.102.153 255.51.102 255.0.102 204.51.102 153.102.102 102.51.51
FF6699 FF3366 FF0066 CC3366 996666 663333
255.153.204 255.51.153 255.0.153 204.0.102 153.51.102 102.0.51
FF99CC FF3399 FF0099 CC0066 993366 660033
255.102.204 255.0.204 255.51.204 204.102.153 204.0.153 153.0.102
FF66CC FF00CC FF33CC CC6699 CC0099 990066
255.204.255 255.153.255 255.102.255 255.51.255 255.0.255 204.51.153
FFCCFF FF99FF FF66FF FF33FF FF00FF CC3399
204.153.204 204.102.204 204.0.204 204.51.204 153.0.153 153.51.153
CC99CC CC66CC CC00CC CC33CC 990099 993399
204.102.255 204.51.255 204.0.255 153.0.204 153.102.153 102.0.102
CC66FF CC33FF CC00FF 9900CC 996699 660066
204.153.255 153.51.204 153.51.255 153.0.255 102.0.153 102.51.102
CC99FF 9933CC 9933FF 9900FF 660099 663366
153.102.204 153.102.255 102.0.204 102.51.204 102.51.153 51.0.51
9966CC 9966FF 6600CC 6633CC 663399 330033
204.204.255 153.153.255 102.51.255 102.0.255 51.0.153 51.0.102
CCCCFF 9999FF 6633FF 6600FF 330099 330066
153.153.204 102.102.255 102.102.204 102.102.153 51.51.153 51.51.102
9999CC 6666FF 6666CC 666699 333399 333366
51.51.255 51.0.255 51.0.204 51.51.204 0.0.153 0.0.102
3333FF 3300FF 3300CC 3333CC 000099 000066
102.153.255 51.102.255 0.0.255 0.0.204 0.51.204 0.0.51
6699FF 3366FF 0000FF 0000CC 0033CC 000033
0.102.255 0.102.204 51.102.204 0.51.255 0.51.153 0.51.102
0066FF 0066CC 3366CC 0033FF 003399 003366
153.204.255 51.153.255 0.153.255 102.153.204 51.102.153 0.102.153
99CCFF 3399FF 0099FF 6699CC 336699 006699
102.204.255 51.204.255 0.204.255 51.153.204 0.153.204 0.51.51
66CCFF 33CCFF 00CCFF 3399CC 0099CC 003333
153.204.204 102.204.204 51.153.153 102.153.153 0.102.102 51.102.102
99CCCC 66CCCC 339999 669999 006666 336666
204.255.255 153.255.255 102.255.255 51.255.255 0.255.255 0.204.204
CCFFFF 99FFFF 66FFFF 33FFFF 00FFFF 00CCCC
153.255.204 102.255.204 51.255.204 0.255.204 51.204.204 0.153.153
99FFCC 66FFCC 33FFCC 00FFCC 33CCCC 009999
102.204.153 51.204.153 0.204.153 51.153.102 0.153.102 0.102.51
66CC99 33CC99 00CC99 339966 009966 006633
102.255.153 51.255.153 0.255.153 51.204.102 0.204.102 0.153.51
66FF99 33FF99 00FF99 33CC66 00CC66 009933
153.255.153 102.255.102 51.255.102 0.255.102 51.153.51 0.102.0
99FF99 66FF66 33FF66 00FF66 339933 006600
204.255.204 153.204.153 102.204.102 102.153.102 51.102.51 0.51.0
CCFFCC 99CC99 66CC66 669966 336633 003300
51.255.51 0.255.51 0.255.0 0.204.0 51.204.51 0.204.51
33FF33 00FF33 00FF00 00CC00 33CC33 00CC33
102.255.0 102.255.51 51.255.0 51.204.0 51.153.0 0.153.0
66FF00 66FF33 33FF00 33CC00 339900 009900
204.255.153 153.255.102 102.204.0 102.204.51 102.153.51 51.102.0
CCFF99 99FF66 66CC00 66CC33 669933 336600
153.255.0 153.255.51 153.204.102 153.204.0 153.204.51 102.153.0
99FF00 99FF33 99CC66 99CC00 99CC33 669900
204.255.102 204.255.0 204.255.51 204.204.153 102.102.51 51.51.0
CCFF66 CCFF00 CCFF33 CCCC99 666633 333300
204.204.102 204.204.51 153.153.102 153.153.51 153.153.0 102.102.0
CCCC66 CCCC33 999966 999933 999900 666600
255.255.255 204.204.204 153.153.153 102.102.102 51.51.51 0.0.0
FFFFFF CCCCCC 999999 666666 333333 000000

На сегодня все! Надеюсь, с помощью этой статьи у Вас получилась идеальная палитра цветов для сайта?! Если есть какие-то свои любимые средства напишите о них в комментариях! Удачи Вам и до скорого…


Савельев Владимир Александрович
С уважением, Владимир Савельев

Премиум курсы от webformyself

Премиум-уроки от клуба webformyself

Это новый революционный продукт в области обучения сайтостроительству! Все лучшие видео-уроки собраны в одном месте и разделены на категории: WordPress, Joomla, PHP, HTML, CSS и JavaScript... База постоянно пополняется и уже сейчас в ней более 200 уроков! Всего за один год - Вы сможете стать опытным веб-мастером "с полного нуля"!
Подробнее
Продвижение в социальных сетях - сервис SocLike.ru
Прочтите еще:
Обсуждение статьи: 26 комментариев


  1. Никита Волков 2014-08-11 в 14:01 

    Цвет — это очень важный момент, безусловно! Чтобы не резало глаз и привлекало, одновременно, посетителя — не простая задача.

    Ответить
  2. Владимир Савельев 2014-08-11 в 15:45 

    ответ для Никита Волков:
    Безусловно это так =)

    Ответить
  3. Дмитрий 2014-09-16 в 12:24 

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

    Ответить
  4. Владимир Савельев 2014-09-16 в 19:33 

    ответ для Дмитрий:
    Да Дмитрий это так, а ты какими сервисами пользуешься?

    Ответить
  5. Дмитрий 2014-09-16 в 20:56 

    ответ для Владимир Савельев:
    Мне нравится paletton.com
    Уже привык к нему, на мой взгляд там все просто и доступно. Причем можно даже посмотреть как может выглядеть сайт в выбранных цветах

    Ответить
    • Никита Волков 2014-09-25 в 08:49 

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

      Ответить
      • Юрий Йосифович 2014-09-25 в 08:50 

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

      • Иван Зелинский 2014-09-25 в 09:17 

        И как тебе удало и на каком цветовом исполнении ты остановился?

    • Владимир Савельев 2014-10-21 в 10:03 

      Добавил в статью ссылку на этот сервис, спасибо Дмитрий :x

      Ответить
      • Иван Зелинский 2014-10-26 в 15:11 

        Дизайн на paletton_е прикольный, а ссылка очень полезна для начинающих веб дизайнеров

  6. Владимир Савельев 2014-09-16 в 20:58 

    Хм нужно глянуть, спасибо за инфу =)

    Ответить
  7. Юрий Йосифович 2014-09-19 в 00:43 

    Полезная табличка — с её помощью можно сделать действительно хороший дизайн с сочитаемыми цветами!

    Ответить
    • Иван Зелинский 2014-09-25 в 07:14 

      Юрий, таблица цветов для это как своеобразный так званый «каталог безопасного кода», который будет отображаться на каждом дисплее практически одинаково и ты прав что таблицы кодов цветовой гаммы дизайнеру легше буде сделать хороший дизайн с сочетаемыми цветами!

      Ответить
  8. Никита Волков 2014-09-19 в 09:02 

    Есть ещё такая штука, что от цветов в середине спектра (зелёный, голубой) глаз быстрее устаёт. В этом плане я немного не тот цвет выбрал) Хотя главное, чтобы смотрелось всё гармонично.

    Ответить
  9. Юрий Йосифович 2014-09-19 в 14:47 

    ответ для Никита Волков:
    Очень важно, чтобы глаза пользователей, читателей, не уставали — если подобрать гамму коряво, то посетители просто из за соображений сохранения зрения не будут возвращаться на блог.
    Я лично серьезно обращаю на это внимание — так как работаю в интернете уже около 10 лет (7 лет аттестату WebMoney).

    Ответить
  10. Никита Волков 2014-09-19 в 16:37 

    ответ для Юрий Йосифович:
    Да это всё ясно. Я тоже на это серьёзно обращаю внимание.

    Ответить
  11. Иван Зелинский 2014-09-21 в 05:07 

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

    Ответить
  12. Никита Волков 2014-09-22 в 09:05 

    ответ для Иван Зелинский:
    Можно сделать так, но думаю, главное, чтобы самому нравилось, а те кто оценят, всегда найдутся.

    Ответить
  13. Иван Зелинский 2014-09-22 в 17:24 

    ответ для Никита Волков:
    Для людей надо делать, если рассчитываешь их удержать на блоге. Если только чтоб только тебе нравилось от сам будешь там зависать без желательного результату

    Ответить
  14. Никита Волков 2014-09-23 в 09:00 

    ответ для Иван Зелинский:
    Нет универсальной гаммы, которая понравилась бы всем. А если подобрать на свой вкус цвета, которые будут хорошо сочетаться, то почему бы и не оставить.
    На эту тему можно бесконечно дискутировать. Думаю, что стоит остаться при своих мнениях.

    Ответить
  15. Иван Зелинский 2014-09-23 в 15:48 

    ответ для Никита Волков:
    Вы правы Никита, на цвет и вкус … — это ведь личное

    Ответить
  16. Александр 2016-01-27 в 16:14 

    Я раньше тоже пользовался подобными таблицами, или искал через поисковик палитру цветов. А сейчас использую программу bColor. Это очень удобный инструмент. Просто наводишь указку на нужный цвет и тебе сразу предоставляется его цифровое значение.

    Ответить
    • Игорь 2016-01-27 в 20:37 

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

      Ответить
      • Александр 2016-01-28 в 17:33 

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

      • Игорь 2016-01-28 в 17:49 

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

  17. Сергей 2016-02-07 в 13:44 

    Доброго времени суток. Спасибо за таблицу, несколько недель назад требовалась, теперь если нужно, знаю где искать)))

    Ответить

Добавить комментарий

Прочитать Соглашение и Правила блога

;-) :| :x :twisted: :smile: :shock: :sad: :roll: :razz: :oops: :o :mrgreen: :lol: :idea: :grin: :evil: :cry: :cool: :arrow: :???: :?:

Приветствую Вас друзья!
Савельев Владимир АлександровичМеня зовут Владимир Савельев, я являюсь автором блога savme.ru! Моя миссия - научить Вас создавать сайты, блоги и зарабатывать на них также, как это делаю я! Уже через год ведения блога я вышел на пассивный доход в 30.000 руб в месяц и это не предел! Еще я частенько пишу о своей жизни и устраиваю конкурсы с крутыми призами! Подпишитесь на мои новости, чтобы не пропустить что-то важное!
Рекомендую покупать шаблоны тут
русские шаблоны для wordpress