Решил начать изучать веб-программирования. Сейчас на этапе изучения стилей CSS. Не могу понять как работает этот linear-gradient с точки зрения расчетов. Какая математическая модель?
Как на самом деле работает linear-gradient в CSS?

Вот пример:

Начальная точка имеет цвет (255, 255, 255, 1), конечная точка имеет цвет (0, 0, 0, 0), какой цвет должен получиться в самой середине между этими двумя крайними точками?
В интернете так и не смог найти правильный ответ. Везде пишут какие-то формулы, которые не соответствуют действительности.

https://developer.mozilla.org/ru/docs/Web/CSS/linear-gradient()
Дока от мозилы не катит?

(1) Раз там нет ответа на мой вопрос, значит не катит.

Может (255/2, 255/2, 255/2, 1/2)?

можешь посмотреть в исходниках хромиума https://chromium.googlesource.com/chromium/src

(0) Спецификация CSS не регламентирует формулу, поэтому реализации могут отличаться (и отличаются).

Если же отвязаться от CSS, то ответы нужно искать в учебниках по комп. графике, либо в документации к популярным библиотекам (Skia, Cairo, AGG и т.д.). Насколько я (смутно) помню, наилучшие в визуальном плане результаты дает интерполяция не в RGB пространстве, а в каком-то другом, более подходящем.

(3) По логике да, так должно быть, но по факту получается (255, 255, 255, 1/2). Почему он так делает, не понятно.

(5) Наверное в sRGB, про него часто пишут.

Уп!

Пип!

зачем тебе это? работает и достаточно

(10) Чтобы работало как ожидается. А то сделаешь как думаешь что оно должно работать, а оно работает по другому. И не понятно как нужно было правильно, приходится методом тыка или гуглить у кого такие же проблемы были

Никто не в курсе? Ну ладно, сам разберусь, как всегда.

Доков не читал, но можно предположить что четвертый параметр регулирует смещение оттенка цвета

(0) Здесь : https://stackoverflow.com/questions/22607043/color-gradient-algorithm/39924008#39924008 немного теории и готовые алгоритмы.

(12) https://infostart.ru/upload/iblock/eb4/bad-help.png

+ (14) Во всех вот этих ваших интернетах пишут так :

(255,0,0) + (0,0,255)  =  ((255+0) div 2,(0+0) div 2,(0+255) div 2)=(127,0,127).

(14) Похоже на правду. Но что-то слишком сложные формулы, со всякими условиями и возведением в степень. Не должно быть так.

(16) Не то, там не учитывается прозрачность.
Должно быть так:
(255, 255, 255, 1) + (0, 0, 0, 0) = (255, 255, 255, 1/2)
Может показаться что это бред какой-то, но так правильно.

Почитай про проблему цвета при работе с картинками.
Там реально единой формулы нет. Есть куча библиотек и все работают по разному.

Градиент это частный случай проблемы преобразования цветов.

А самое страшное, что один и тот же цвет можно получить несколькими вариантами,
То есть единственного решения не существует в принцепе

(19) это как это в ргб 1 цвет можно получить несколькими вариантами?
можно пример?

Вероятно имеется ввиду полином как какой-то степени...

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

(0) Вот ты тупой. Формула элементарная:

С = (С1 * A1 * x + C2 * A2 * (1 - x)) * 2 / (A1, A2)

Где C - это компонента цвета (R или G или B), а А - это компонента прозрачности. х - это координата межу начальной и конечной точкой, от 0 до 1.

(20) начнем с того, что есть понятие "глубина цвета" (есть 24 бит, есть 32 бита, есть 48 бит есть и поболее) в рамках этой "глубины" каждая конкретная картинка имеет некую точку отсчета и далее от нее считаются цвета.

На 1 цвет для 1 точке может требоватся разное количество бит, то есть #F00F для 24 битов и для 32 битов означают разное...

Еще есть понятие "альфа канал", очень условно это начало системы координат цветовой палитры.

Короче вариантов просто очень большое...

Ну по поводу множественности для одного цвета - такое реально существует и вызывает большие проблеммы

Если я правильно понимаю то прозрачность определяет как цвет смешается с цветом родителя / подложки.
Т.е. цвет данного конкретного пикселя будет зависеть не только от функции градиента но и от того что под этим градиентом.

(25) В данном случае цвет родителя не рассматривается, нужно найти только RGBA компоненты цвета слоя, что само по себе не просто и не однозначно. Конечный цвет после наложения - это уже отдельный разговор.