Как изменить цвет градиента inkscape - Исправление ошибок и поиск оптимальных решений проблем

Алексей Дмитриев, 29 декабря 2011

На семнадцатом месте Панели инструментов расположился инструмент Градиент
. Всплывающая подсказка называет его Создавать и править градиенты, а вызвать инструмент можно горячими клавишами CTRL+F1 (работает не во всех рабочих столах, обычно эта комбинация переключает на первое рабочее место), поэтому надежнее пользоваться горячей клавишей g.

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

Рис. 1

Как явствует из рисунка 1, градиентным может быть не только цвет заливки объекта, но и цвет его обводки.

Создавать градиенты при помощи инструмента Градиент намного удобнее, чем при помощи меню Объект ⇨ Заливка и Обводка (Глава 4).

На Панели настройки инструмента:

Выбираем:

В настройке Новый ≈ нужный тип градиента: линейный или радиальный (всплывающая подсказка поможет).
В настройке На ≈ к чему применить градиент: к заливке или к обводке.

После чего остается провести по объекту указателем инструмента при нажатой левой кнопке мыши.

Рис. 3

Объект зальется градиентом. На рисунке 3 показана разница между линейным и радиальным градиентом.

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

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

По умолчанию будет создан градиент на базе исходного цвета объекта. На квадратной опорной точке будет исходный цвет полностью непрозрачный, на круглой ≈ исходный цвет полностью прозрачный.

Чтобы изменить градиент нужно действовать, как показано на рисунке 4:

Рис. 4

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

Кликнем на левой опорной точке рычага градиента; квадратик окрасится.
Выберем в Палитре желтый цвет и кликнем на нем; градиент станет от желтого к красному.

У радиального градиента два рычага, но схема действий аналогична.

Рис. 5

Можно изменять длину рычагов независимо друг от друга (рисунок 5 слева). Можно выделить обе круглые опорные точки (при помощи клавиши SHIFT), тогда рычаги будут удлиняться синхронно.

При помощи комбинации клавиш SHIFT+R можно изменять градиент на противоположный, что особенно удобно для радиального градиента (рисунок 6).

Рис. 6

Двойной клик левой кнопкой мыши на рычаге градиента добавит новую опорную точку.
CTRL+ALT+клик левой кнопкой мыши также добавляют опорную точку.

DEL удалит выделенную опорную точку.

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

Рис. 7

На рисунке 7: радиальный градиент с тремя опорными точками.

Опорных точек может быть сколько угодно, как на рисунке 8:

Рис. 8

В секции при помощи стрелок можно просмотреть все уже имеющиеся в данном файле градиенты и выбрать нужный.

Кнопка Изменить открывает Редактор градиентов. Этот редактор позволяет выбрать для опорных точек градиента цвета, которых нет в Палитре (или если лень просматривать все многочисленные палитры).

Рис. 9

На рисунке 9 представлен прямоугольник, залитый градиентом от желтого к розовому, (слева) и окно редактора градиентов, относящееся к данному прямоугольнику (справа).

В самом верху окна полоска, представляющая данный градиент.
Ниже секция выбора опорной точки, подлежащей редактированию. Клик мышью на стрелочках, обведенных красным кружком, откроет список всех опорных точек и позволит выбрать нужную.
Еще ниже ползунок Смещение показывает положение выбранной опорной точки. Для крайних опорных точек (квадратной и круглой), этот ползунок находится в крайнем левом или крайнем правом положении и не двигается. Если добавлены дополнительные опорные точки, то можно с достаточной точностью перемещать их при помощи данного ползунка.
Далее следует секция выбора цвета опорной точки. Выбирать цвет можно по четырем различным системам: RGB, HSL, CMYK или Круг. Подробно об этих системах читайте в Главе 18.
В нижнем правом углу окна расположено окно ввода шестнадцатеричного номера цвета по системе RGBA, где А обозначает непрозрачность. На рисунке 9 это желтый цвет при полной непрозрачности.

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

Создание градиентов при помощи окна Заливка и Обводка.

Следует иметь в виду, что заливать объекты градиентом можно и без помощи инструмента Градиент. Меню Объект ⇨ Заливка и Обводка имеет для этого даже больше возможностей (например создание повторяющихся градиентов). Подробный пример создания градиента при помощи этого меню находится в Главе 4.

В следующей главе рассмотрим инструмент Пипетка.

Если вам понравилась статья, поделитесь ею с друзьями:

Источник

Подробности: Категория: Inkscape 0.48; Опубликовано 19.12.2011 18:45; Автор: Шитов В.Н.; Просмотров: 10862

Инструмент Градиент () предназначен для редактирования градиентных заливок. После выбора инструмента указатель мыши принимает следующий вид () и открывается панель параметров (Рис. 37). Данный инструмент позволяет редактировать градиентные заливки линейного или радиального типов, а также преобразовывать монохромные или текстурные заливки в градиентные.

Рис. 37. Панель параметров для инструмента Градиент

Начнем рассмотрение инструмента с правил редактирования имеющихся градиентных заливок. После выбора инструмента Градиент на объекте с градиентной заливкой появляются направляющие линии и маркеры. И линии и маркеры на каждом типе градиента имеют совершенно разный вид. На линейном типе градиента направляющая по умолчанию находится строго по горизонтали. На концах направляющей линии находятся два квадратных маркера (Рис. 38).

Рис. 38. Линейный градиент

По умолчанию линейный градиент накладывается слева направо. Весь градиент умещается по ширине объекта, на который он наложен. Посмотрите на направляющую — она то и определяет ширину градиента. Для изменения направления градиента нужно перетащить один из маркеров так, чтобы направляющая показывала нужное направление. Если Вы по очереди повернете направляющую за маркеры наоборот, то и градиент развернется наоборот. Выше мы уже говорили, что ширина направляющей определяет ширину градиента. Если ширину направляющей изменить, то ширина градиента также изменится. Это можно использовать в том случае, если необходимо усилить одну из сторон градиента.

На радиальном градиенте находится направляющая под углом 90° (Рис. 39). На общем узле направляющей находится маркер в виде ромба. Этот маркер предназначен для смещения центра радиального градиента. На свободных концах лучей направляющей расположены круглые маркеры. Эти маркеры предназначены для поворота радиального градиента вокруг центра радиального градиента. Несмотря на возможность поворота лучей, угол между лучами направляющей все равно остается 90°. Каждый луч направляющей по умолчанию исходит из центра радиального градиента и направлен один строго направо, а другой строго вверх. Центр радиального градиента расположен строго в центре объекта, на который этот градиент наложен.

Рис. 39. Радиальный градиент

Линейный и радиальный градиенты можно преобразовывать друг в друга. Для этого на панели параметров предназначены две кнопки: Создать линейный градиент и Создать радиальный градиент. Нажатие на одну из этих кнопок еще не превращает один тип градиента в другой. После выбора другого типа градиента нужно дважды щелкнуть по градиенту инструментом Градиент. Только после этого тип градиента меняется. Одновременно с изменением типа градиента меняется и внешний вид направляющей и маркеров градиента. На панели параметров находятся кнопки: Создать градиент в заливке и Создать градиент в штрихе. В зависимости от нажатой кнопки градиент редактируется или в заливке, или в штрихе. Чтобы применить градиент также выполняется двойной щелчок по объекту. При этом все равно, в какое место объекта выполняются щелчки: в область заливки или в область штриха. Объекты, залитые монохромной или текстурной заливкой можно преобразовывать в градиент. Для этого на панели параметров выбирается тип градиента (нажимается соответствующая кнопка) и выполняется двойной щелчок мышью. При преобразовании монохромных или текстурных заливок в градиентные, предлагается простейший градиент, как правило, один цвет (например, красный) переходит в белый. Если предложенный градиент не подходит, то можно предложить следующие варианты решения:

В списке Менять выберите другие варианты градиентов, если они там имеются;

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

Источник

Градиентные заливки

В редакторе

Inkscape доступны 2 типа градиентной заливки: линейная (см. звезду слева) и радиальная (см. звезду справа).

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

Также градиент можно настроить, используя инструмент Создавать и править градиенты.

При выборе градиентной заливки в окне

заливка и штрих

откроется такая вкладка:

В данной вкладке необходимо нажать кнопку Изменить. Откроется окно Редактор градиентов.

По умолчанию градиент представляет из себя переход от 100% непрозрачного цвета, которым был закрашен объект, к полной прозрачности. То есть цвет градиента определяется цветом 2-х точек: начальной и конечной (в нашем примере это точки stop 12229 (цвет зелёный) и stop 12231 (цвет прозрачный)..

Соответственно, чтоб изменить простой градиент, надо:

●Выбрать точку из списка (вверху окна под полосой градиента),

●Изменить её цвет и прозрачность.

Задание 4. Создать двухцветную градиентную заливку и использовать её для закраски объекта.

●Создать объект (например, эллипс или многоугольник),

●Вызвать меню Заливка и штрих.

●Во вкладке Заливка выбрать Линейный градиент. Нажать кнопку Изменить.

●В Редакторе градиентов последовательно из меню выбрать 2 точки (начальную и конечную).

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

Замечание: для изменения линейного градиента на радиальный

достаточно во вкладке Заливка меню Заливка и штрих выбрать

Радиальный градиент.

Задание 5. Создать многоцветную градиентную заливку и использовать её для закраски объекта.

●Создать объект (например, эллипс или многоугольник),

●Вызвать меню Заливка и штрих.

●Во вкладке Заливка выбрать Линейный градиент. Нажать кнопку Изменить.

●В Редакторе градиентов из меню выбрать начальную точку (выходит по умолчанию).

●Для неё выбрать цвет и установить параметр прозрачности.

●Добавить промежуточною точку.

Для этого надо нажать кнопку Добавить опорную точку. По умолчанию она будет ровно в середине градиента (параметр

Смещение).

Для этой точки выбрать цвет и установить параметр прозрачности. ● Добавить нужное количество промежуточных точек.

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

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

Замечания:

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

2.Созданные градиенты сохраняются в пределах файла и могут быть применены к другим объектам.

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

Задание 6. Выполнить интерактивную настройку линейного градиента.

●Нарисовать фигуру, например, прямоугольник или звезду.

●Вызвать панель Заливка и штрих.

●Выбрать вкладку Заливка.

●Выбрать линейный градиент. Выбрать один из градиентов (или оставить градиент по умолчанию). Рисунок примет вид:

●В середине объекта появится средняя линия, ограниченная двумя белыми квадратными маркерами. По умолчанию весь градиент распределяется вдоль этой линии.

●Изменение длины линии ведёт к растягиванию градиента (видимым становится только его часть) или к его уменьшению.

●Также можно произвольно вращать начальную и конечную точки линии градиента, в результате чего можно получить самые причудливые эффекты.

●Изменяя параметр Повтор (по умолчанию нет, можно выбрать отражённый или повторный), можно получить различные цветовые сочетания.

Задание 7. Выполнить интерактивную настройку радиального градиента.

●Нарисовать фигуру, например, прямоугольник или звезду.

●Вызвать панель Заливка и штрих.

●Выбрать вкладку Заливка.

● Выбрать линейный градиент. Выбрать один из градиентов (или оставить градиент по умолчанию). Рисунок примет вид:

●В середине объекта появится угол, центр и границы старон которого выделены белыми квадратными маркерами. По умолчанию весь градиент распределяется вдоль сторон этого угла.

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

● Изменяя параметр Повтор, можно также получить очень красивые изображения.

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

Упражнение.

Создать иллюстрацию «Закат солнца». Идея принадлежит Рику Олтману. Элементы рисунка будем создавать в следующем порядке:

1.Небо,

2.Вода,

3.Солнце,

4.Отражение солнца в воде.

●Выбрать альбомную ориентацию рабочего листа.

●Создать прямоугольники для воды и неба.

●Выделить верхний прямоугольник (небо) и закрасить его градиентной заливкой:

Красный горизонт	0C + 50M + 25Y + 12K

Переход к оранжевому	0C + 60M + 100Y + 0K

Светло-жёлтый	0C +	0M + 40Y + 0K

Постепенный переход в темноту	40C +	50M + 0Y + 0K

Ночное небо	100C + 70M + 0Y + 25K

● Выделить нижний прямоугольник (воду) и закрасить его градиентной заливкой:

Тёмная вода	0C + 50M + 25Y + 12K

Не очень тёмная вода	0C + 60M + 100Y + 0K

Светлая полоса	0C +	0M + 40Y + 0K

Глубокий красный	40C +	50M + 0Y + 0K

Горизонт	100C + 70M + 0Y + 25K

Теперь воду и землю разделяет чёрная линия. Её необходимо удалить. ● Удалить контур у обоих прямоугольников.

● Нарисовать контур светящегося солнца: создать эллипс и отредактировать его.

Соседние файлы в предмете [НЕСОРТИРОВАННОЕ]

Источник

В этом уроке я покажу вам, как заполнить текст градиентом с помощью Inkscape, бесплатного редактора векторной графики! Это очень простая техника, которая требует всего пару шагов, так что давайте углубимся!

Для начала возьмите инструмент «Текст» из набора инструментов Inkscape, щелкнув его значок (красная стрелка на изображении выше) или нажав клавишу быстрого доступа «T» на клавиатуре.

Затем измените шрифт на нужный, щелкнув раскрывающийся список (красная стрелка на изображении выше) и выбрав имя шрифта (зеленая стрелка на изображении выше — вы также можете просто начать вводить имя шрифта в текстовом поле, если вы знаете имя вашего шрифта уже).

Я также изменю размер шрифта (красная стрелка на изображении выше) на 144 pts (зеленая стрелка), чтобы он был красивым и большим, когда мы впервые добавляем наш текст.

Когда вы будете готовы, щелкните на своем холсте текстовым инструментом, чтобы создать строку текста. Затем введите свой текст (я выбрал «INKCAPE» для своего текста — красная стрелка на изображении выше).

Затем нажмите на инструмент «Градиент» на панели инструментов (красная стрелка на изображении выше). Чтобы нарисовать градиент внутри вашего текста, щелкните и перетащите мышь от верхней части текста к нижней (зеленая стрелка — примечание: если вы удерживаете клавишу Ctrl, она нарисует ваш градиент в прямолинейном режиме). Начальная и конечная точки могут выходить за пределы вашего текста — градиент по-прежнему будет рисоваться только внутри вашего текста. Поэтому не стесняйтесь экспериментировать с расположением этих точек, чтобы получить другой результат.

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

Самый простой способ — щелкнуть любой маркер градиента, известный как «начало» для первого маркера или «конец» для последнего нарисованного маркера, а затем щелкнуть левой кнопкой мыши цвет в цветовой палитре Inkscape. Например, я нажму градиент «начало» с помощью своего инструмента градиента (красная стрелка на изображении выше), затем щелкните левой кнопкой мыши красный цвет в цветовой палитре (синяя стрелка).

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

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

Это вызовет диалоговое окно «Заливка и обводка» (обведено зеленым на изображении выше).

Если вы не попали в редактор градиентов автоматически при открытии диалогового окна «Заливка и обводка», щелкните вкладку «Заливка» (красная стрелка на изображении выше), затем щелкните значок «Линейный градиент» (зеленая стрелка).

Щелкните стрелку рядом с «Остановки», чтобы развернуть функцию остановки градиента (красная стрелка на изображении выше). Это позволит вам просматривать и редактировать каждую «остановку» или ручку градиента.

Нажмите на остановку, которую вы хотите изменить (зеленая стрелка на изображении выше), затем измените цвет останова с помощью ползунков цвета. Если у вас есть HEX-код цвета, который вы хотите использовать, вы можете скопировать и вставить этот код в поле рядом с «RGBA» (обведено синим цветом на изображении).

В моем случае я знаю, что шестнадцатеричный код моего первого цвета — «F75C03», поэтому я вставлю этот код в поле RGBA.

Повторите этот процесс, щелкнув вторую точку градиента (красная стрелка), затем выбрав новый цвет с помощью ползунков или вставив свой HEX-код (обведен синим на изображении выше — мое второе значение HEX-кода — «F1C40F»).

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

Вы можете изменить положение точек градиента, щелкнув и перетащив стрелки вдоль ползунка градиента в верхней части диалогового окна (зеленая стрелка на изображении). Вы также можете вручную установить положение остановок с помощью этого ползунка, щелкнув стрелку, соответствующую этой остановке, а затем введя числовое значение в поле «Смещение остановки» (обведено синей пунктирной линией на изображении).

Наконец, вы можете изменить тип градиента на любой из нескольких параметров Inkscape, щелкнув значки в верхней части диалогового окна (обведены зеленым на фотографии). Например, если я щелкну значок «Радиальный градиент» (синяя стрелка), мой линейный градиент изменится на радиальный или круговой градиент.

Я могу изменить размеры радиального градиента, перетаскивая маркеры на холсте (красные стрелки на изображении выше), а также перемещая точки остановки градиента либо непосредственно на холсте, либо с помощью ползунка градиента в диалоговом окне «Заливка и обводка».

Когда вы закончите настройку градиента, вы можете щелкнуть другой инструмент, например инструмент «Выбор» (красная стрелка), чтобы увидеть готовый продукт без ручек. Обратите внимание, что вы по-прежнему можете редактировать градиент с помощью диалогового окна «Заливка и обводка» без инструмента «Градиент», пока текст выделен.

Последнее, что я упомяну, это то, что вы можете изменить свой текст после того, как добавили градиент, и новый текст будет отображать тот же градиент. Итак, если я возьму свой текстовый инструмент еще раз, щелкну текст «INKCAPE» и наберу что-то новое, например «GRADIENT», вы увидите, что новый текст будет иметь тот же градиент, что и старый текст.

Вот и все! Если вам понравилось, вы можете ознакомиться с другими моими учебными пособиями по Inkscape и справочными статьями по Inkscape.

Источник

Сегодня мы еще раз поговорим о таком важном инструменте inkscape как градиент. Речь пойдет о линейном градиенте и его применении для создания изображения … губной помады. Да, да именно так.

Линейный градиент и имитация блестящих поверхностей.

Итак, запускайте редактор и давайте составим конкуренцию известным брендам.

Шаг 1. Рисуем пенал

Верхняя часть пенала будет блестящей. Блики и отражения на таких поверхностях чаще всего резкие и четкие.

На этом этапе нам потребуется инструмент рисования прямоугольников и квадратов. Нарисуйте с помощью этого инструмента прямоугольник. Пропорции высоты и ширины приблизительно как 2 к 1.

Займемся заливкой. В качестве заливки задайте линейный градиент в панели Заливка и обводка. Так как точек градиента будет много, то я повернул прямоугольник на 90 градусов чтобы уместить рисунке все точки.

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

Опорные точки градиента (по умолчанию их две) имеют вид квадрата и круга (начальная и конечная точка). Все добавляемые точки линейного градиента имеют вид ромбика.

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

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

Не забудьте, рисунок выше был повернут на 90 градусов!

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

Создайте копию прямоугольника и уменьшите его высоту. Эту копию разместите ниже первого прямоугольника.

Разместите их вплотную друг к другу. Если необходимо, то выровняйте их. Создайте еще одну копию прямоугольника высотой в половину первого прямоугольника. Для этой копии необходимо изменить линейный градиент (см. ниже).

Я опять временно повернул на 90 градусов этот экземпляр для удобства указывания цвета градиента. Лишние точки градиента легко удалить. Для этого выбираем точку градиента и нажимаем клавишу Del.

Добавьте пару прямых на границу между двумя прямоугольниками как показано ниже.

Выравниваем все три прямоугольника и группируем Ctrl+G. Под пенал губной помады добавьте тень. Это может быть прямая линия или очень вытянутый эллипс.

Шаг 2. А вот и помада

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