Возможно ли сделать вертикальный градиент текста css js?

Question

[freekir]

На CSS как понял сейчас есть правило только для chrome:

background: -webkit-gradient(linear, left bottom,left top,color-stop(0.2, #336),color-stop(1, #FFF));, black;
-webkit-background-clip: text;
color: transparent;

И если бы это работало везде то был бы не мир а сказка, но это только chrome.

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

Пробовал такое.
mrnix.ru/pxgradient/index_en.html

Еще есть вариант с SVG, но что-то он мне не очень по душе.
lea.verou.me/2012/05/text-masking-the-standards-way

Есть ли у вас какие-то решения?

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

Answer 1

[Dmmitry]

Это пробовали?

background: linear-gradient(to top, #fefcea, #f1da36);

Comments

[freekir]

Так это же для блоков, чтобы задавать фоны, а текст через это правило не стилизовать или я что-то путаю? jsfiddle.net/sr5m2jgb