特别浅的渐变蓝色在html里,javascript – 渐变色淡淡的3种颜色

我一直在尝试使用HTML5和渐变渐变,我想使用3种颜色并逐渐淡化它们.目前我只能使用两种颜色.

我的目标与此图像类似：

颜色应该慢慢淡入彼此,我很满意我目前工作的淡化效果,虽然想添加第三种颜色.

我试图添加一个颜色数组来使用,但颜色函数是从教程修改(如果我能找到将添加链接),我不太清楚如何做到这一点.

任何人都可以提供任何adivce吗？

提前致谢.

我不是试图让它看起来与图像完全相同,但如果我可以为我当前版本添加另一种颜色应该没问题.

编辑：由于混乱：我不是在寻找一个“静态”的灰色,如果你仔细观察我的例子,你会看到一个褪色效果.我想达到相同的效果,但是有3种颜色的渐变,看起来与上面的图像类似.

它应该“闪烁”并逐渐淡化.提供赏金,因为我正在努力创造3种颜色,我认为这将是最容易的..

解决方法:

除非你需要做一些复杂的动画,否则你正在为渐变做一些非常不必要的计算.渐变的要点是你给它一些种子值,它会自动生成一切.

请注意,看起来您的参考图像可能具有少量纹理,并且渐变绝对不是线性的.如果要重新创建参考图像,则必须使用一些径向渐变并可能覆盖纹理.

另请注意,您是通过CSS属性设置画布宽度和高度.使用canvas元素,CSS宽度和高度控制元素的放大率,而DOM级属性控制实际尺寸.

编辑：我完全错过了你想要制作动画渐变的事实.我为此道歉.

我回去编辑了我的示例,以便在三种预定义颜色之间平滑过渡,类似于参考图像中的颜色.您可以在此处查看更新的示例：

这更像是你想要的吗？

编辑：这是另一个更新,它增加了全屏幕支持,一个对角线渐变,以及一个覆盖在中间的辅助径向渐变,以帮助提供一些变化：

您可能希望稍微自定义颜色以增加变化,但希望功能现在存在.

标签：javascript,gradient,canvas

来源： https://codeday.me/bug/20190721/1495114.html

特别浅的渐变蓝色在html里,javascript – 渐变色淡淡的3种颜色相关推荐

c语言中怎么对圆环填充颜色,ps里怎么把圆环填充两种颜色
1.PS中怎么给圆形填充颜色给选区域图层填充颜色选择一种前景色或背景色. 选择要填充的区域.要填充整个图层,请在"图层"面板中选择该图层. 选取"编辑"&a ...
口袋里有红黄蓝白黑5种颜色的球若干个。每次从口袋中先后取出3个球，问得到3种不同颜色的可能取法，输出每种排列的情况。
解题思路:求只能是5种颜色之一,而且要判断个球是否同色,可以使用美剧类型变量处理. #include<stdio.h> int main(){enum Color{red,yellow,b ...
第一百一十八期:运行 JavaScript 代码片段的 20 种工具
运行 JavaScript 代码片段的 20 种工具前端日常开发中,我们使用喜爱的 IDE 调试 JavaScript 代码,比如我喜欢的代码编辑器有两个,Sublime Text 3 和 VS C ...
wps里的茶色字体怎么设置_《excel颜色筛选》 WPS2019的EXCEL整行填充一种颜色保存后关闭再打开就变成两种深浅不同的颜色是怎么回事呢？请大神帮忙解决...
WPS2019的EXCEL整行填充一种颜色保存后关闭再打开就变成两种深浅不同的颜色是怎么回事呢?请大神帮忙解决格式刷提取那个单元格格式复制后颜色,保存后打开也的吗? 还有你可以右键单元格后下两种的图 ...
30个深度学习库：按Python、C++、Java、JavaScript、R等10种语言分类
30个深度学习库:按Python.C++.Java.JavaScript.R等10种语言分类包括 Python.C++.Java.JavaScript.R.Haskell等在内的一系列编程语言的深度 ...
CSS里总算是有了一种简单的垂直居中布局的方法了
<!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head><me ...
java图形界面颜色随机变换,JavaScript实现鼠标移入随机变换颜色
大家好! 今天分享一个在 JavaScript中,实现一个鼠标移入可以随机变换颜色. /* 这里定义一下div(块元素)已下span 标签的宽.高.边框线以及边框线的颜色*/ span{ displa ...
python 字符串删除重复_Python删除list里的重复元素有几种方法？
公众号新增加了一个栏目,就是每天给大家解答一道Python常见的面试题,反正每天不贪多,一天一题,正好合适,只希望这个面试栏目,给那些正在准备面试的同学,提供一点点帮助! 小猿会从最基础的面试题开始, ...
(转)javascript异步编程的四种方法
本文转自:http://www.ruanyifeng.com/blog/2012/12/asynchronous%EF%BC%BFjavascript.html 作者:阮一峰本文仅仅作为个人mark ...

特别浅的渐变蓝色在html里,javascript – 渐变色淡淡的3种颜色

特别浅的渐变蓝色在html里,javascript – 渐变色淡淡的3种颜色相关推荐

最新文章

热门文章