Сейшельский Манимейкер

Мне часто приходится переделывать дизайны шаблонов. Раньше частенько приходилось иметь дело с шаблонами WordPress, я переделывал дизайны для своих блогов/сателлитов. Сейчас это бесплатные шаблоны для дорвеев.

Но и в том и другом случае, одной из самых частых переделок являлась смена цветов - фон, шрифты, элементы дизайна (кнопки к примеру). Раньше работа по переделке цветов отнимала немало времени, т.к. я не знал о полезных и удобных фичах, помогающих делать это быстрее. Из всего что я использовал, для меня спасением была небольшая софтина ColorPix, которая позволяла выбрать пипеткой (как инструмент в PhotoShop) любой цвет на экране, соответственно я это использовал для того чтобы выяснить какой цвет где в шаблоне и поменять в стилях.

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

Но всё же спасение пришло ко мне. В лице плагина для Firefox - ColorZilla (офсайт).

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

Немного о функционале:

1) При нажатии на иконку плагина левой кнопкой, по умолчанию включается тот же упомянутый уже инструмент Пипетка, который позволяет выбрать любой цвет в любом районе окна браузера. Для выбора достаточно кликнуть левой кнопкой там, где необходимо выбрать цвет. В ColorPix приходилось тянуть руку к клавиатуре, хотя я не настолько ленив, конечно же :)

При этом, если в Options > Autocopy выбрать Enabled, и выбрать нужный режим копирования, при выборе цвета - он будет автоматически копироваться в буфер обмена, что тоже весьма удобно. Копировать плагин может в различных вариациях - hex-цвета, rgb-цвета, для простых цветов также названия - white, black, gray, maroon и т.п;

2) Другим, сверхполезным, инструментом для меня явился показ названия div'ов/классов/элементов. То есть, при включении пипетки плагина - внизу возле его иконки показываются не только параметры цветов и положения курсора, но и название элемента/слоя. Например, поле ввода где я пишу сейчас этот текст, имеет свойство textarea#content, т.е. элемент textarea в слое content. Очень и очень удобно, теперь я не ищу долгое время где какой элемент и какой из них в какой вложен. Простое и элегантное решение;

3) Есть штука, как анализ DOM (Document Object Model) страницы. Плагин анализирует все используемые цвета на странице и выдаёт полный список какой из цветов для какого стиля/слоя/элемента используется. При проверке страницы создания поста WP - выглядит весьма внушительно и даже монстроузно (и это лишь малая часть);

4) Если хочется попасть точно в пиксель - у плагина есть лупа с увеличением до 1000%. Не промажете точно;

5) Можно также выбрать цвет подбором вручную, можно выбрать из палитры цветов (а подключить разнообразные палитры).

6) Можно добавлять цвета в избранное - очень удобная фича, которой впрочем я не пользуюсь пока.

Вот такой простой плагин к браузеру, серьёзно облегчающий мне жизнь.

А какими плагинами пользуетесь вы?

9 комментариев к этому посту