小程序画布颜色Color

Color

颜色。可以用以下几种方式来表示 canvas 中使用的颜色:

  • RGB 颜色: 如 'rgb(255, 0, 0)'
  • RGBA 颜色:如 'rgba(255, 0, 0, 0.3)'
  • 16 进制颜色: 如 '#FF0000'
  • 预定义的颜色: 如 'red'

其中预定义颜色有以下148个: 注意*: Color Name 大小写不敏感

Color NameHEX
AliceBlue#F0F8FF
AntiqueWhite#FAEBD7
Aqua#00FFFF
Aquamarine#7FFFD4
Azure#F0FFFF
Beige#F5F5DC
Bisque#FFE4C4
Black#000000
BlanchedAlmond#FFEBCD
Blue#0000FF
BlueViolet#8A2BE2
Brown#A52A2A
BurlyWood#DEB887
CadetBlue#5F9EA0
Chartreuse#7FFF00
Chocolate#D2691E
Coral#FF7F50
CornflowerBlue#6495ED
Cornsilk#FFF8DC
Crimson#DC143C
Cyan#00FFFF
DarkBlue#00008B
DarkCyan#008B8B
DarkGoldenRod#B8860B
DarkGray#A9A9A9
DarkGrey#A9A9A9
DarkGreen#006400
DarkKhaki#BDB76B
DarkMagenta#8B008B
DarkOliveGreen#556B2F
DarkOrange#FF8C00
DarkOrchid#9932CC
DarkRed#8B0000
DarkSalmon#E9967A
DarkSeaGreen#8FBC8F
DarkSlateBlue#483D8B
DarkSlateGray#2F4F4F
DarkSlateGrey#2F4F4F
DarkTurquoise#00CED1
DarkViolet#9400D3
DeepPink#FF1493
DeepSkyBlue#00BFFF
DimGray#696969
DimGrey#696969
DodgerBlue#1E90FF
FireBrick#B22222
FloralWhite#FFFAF0
ForestGreen#228B22
Fuchsia#FF00FF
Gainsboro#DCDCDC
GhostWhite#F8F8FF
Gold#FFD700
GoldenRod#DAA520
Gray#808080
Grey#808080
Green#008000
GreenYellow#ADFF2F
HoneyDew#F0FFF0
HotPink#FF69B4
IndianRed#CD5C5C
Indigo#4B0082
Ivory#FFFFF0
Khaki#F0E68C
Lavender#E6E6FA
LavenderBlush#FFF0F5
LawnGreen#7CFC00
LemonChiffon#FFFACD
LightBlue#ADD8E6
LightCoral#F08080
LightCyan#E0FFFF
LightGoldenRodYellow#FAFAD2
LightGray#D3D3D3
LightGrey#D3D3D3
LightGreen#90EE90
LightPink#FFB6C1
LightSalmon#FFA07A
LightSeaGreen#20B2AA
LightSkyBlue#87CEFA
LightSlateGray#778899
LightSlateGrey#778899
LightSteelBlue#B0C4DE
LightYellow#FFFFE0
Lime#00FF00
LimeGreen#32CD32
Linen#FAF0E6
Magenta#FF00FF
Maroon#800000
MediumAquaMarine#66CDAA
MediumBlue#0000CD
MediumOrchid#BA55D3
MediumPurple#9370DB
MediumSeaGreen#3CB371
MediumSlateBlue#7B68EE
MediumSpringGreen#00FA9A
MediumTurquoise#48D1CC
MediumVioletRed#C71585
MidnightBlue#191970
MintCream#F5FFFA
MistyRose#FFE4E1
Moccasin#FFE4B5
NavajoWhite#FFDEAD
Navy#000080
OldLace#FDF5E6
Olive#808000
OliveDrab#6B8E23
Orange#FFA500
OrangeRed#FF4500
Orchid#DA70D6
PaleGoldenRod#EEE8AA
PaleGreen#98FB98
PaleTurquoise#AFEEEE
PaleVioletRed#DB7093
PapayaWhip#FFEFD5
PeachPuff#FFDAB9
Peru#CD853F
Pink#FFC0CB
Plum#DDA0DD
PowderBlue#B0E0E6
Purple#800080
RebeccaPurple#663399
Red#FF0000
RosyBrown#BC8F8F
RoyalBlue#4169E1
SaddleBrown#8B4513
Salmon#FA8072
SandyBrown#F4A460
SeaGreen#2E8B57
SeaShell#FFF5EE
Sienna#A0522D
Silver#C0C0C0
SkyBlue#87CEEB
SlateBlue#6A5ACD
SlateGray#708090
SlateGrey#708090
Snow#FFFAFA
SpringGreen#00FF7F
SteelBlue#4682B4
Tan#D2B48C
Teal#008080
Thistle#D8BFD8
Tomato#FF6347
Turquoise#40E0D0
Violet#EE82EE
Wheat#F5DEB3
White#FFFFFF
WhiteSmoke#F5F5F5
Yellow#FFFF00
YellowGreen#9ACD32

分类小程序画布功能相关推荐:

小程序画布创建离屏 canvas 实例wx.createOffscreenCanvas 小程序创建 canvas 的绘图上下文 CanvasContext 对象wx.createCanvasContext 小程序画布生成图片wx.canvasToTempFilePath 小程序将像素数据绘制到画布wx.canvasPutImageData 小程序获取 canvas 区域隐含的像素数据wx.canvasGetImageData 小程序Canvas的使用方法 小程序画布返回 Canvas 的绘图上下文Canvas.getContext 小程序画布创建一个图片对象Canvas.createImage 小程序画布重绘Canvas.requestAnimationFrame 小程序取消由 requestAnimationFrame 添加到计划中的动画帧请求Canvas.cancelAnimationFrame 小程序画布创建一个 ImageData 对象Canvas.createImageData 小程序画布创建 Path2D 对象Canvas.createPath2D 小程序画布犯创建图片展示的 data URI Canvas.toDataURL 小程序canvas 组件的绘图上下文CanvasContext 小程序画布draw用法CanvasContext.draw 小程序画布创建一个线性的渐变颜色CanvasContext.createLinearGradient 小程序创建一个圆形的渐变颜色CanvasContext.createCircularGradient 小程序画布对指定的图像创建模式的方法CanvasContext.createPattern 小程序画布测量文本尺寸信息CanvasContext.measureText 小程序画布保存绘图上下文CanvasContext.save 小程序画布恢复之前保存的绘图上下文 小程序画布开始创建一个路径CanvasContext.beginPath 小程序把路径移动到画布中的指定点CanvasContext.moveTo 小程序画布增加一个新点CanvasContext.lineTo 小程序画布创建二次贝塞尔曲线路径CanvasContext.quadraticCurveTo 小程序创建三次方贝塞尔曲线路径CanvasContext.bezierCurveTo 小程序画布创建一条弧线CanvasContext.arc 小程序创建一个矩形路径CanvasContext.rect 小程序画布根据控制点和半径绘制圆弧路径CanvasContext.arcTo 小程序画布裁剪任意形状和尺寸CanvasContext.clip 小程序画布填充一个矩形CanvasContext.fillRect 小程序画布画一个非填充矩形CanvasContext.strokeRect 小程序画布清除画布上矩形区域内的内容CanvasContext.clearRect 小程序画布对路径中的内容进行填充CanvasContext.fill 小程序画布画出当前路径的边框CanvasContext.stroke 小程序画布关闭一个路径CanvasContext.closePath 小程序画布路径缩放CanvasContext.scale 小程序画布旋转 小程序画布变化画布圆点位置 小程序画布绘制图像到画布CanvasContext.drawImage 小程序画布绘制文本描边 小程序使用矩阵多次叠加当前变换的方法CanvasContext.transform 小程序使用矩阵设置当前变换的方法CanvasContext.setTransform 小程序画布设置填充色CanvasContext.setFillStyle 小程序画布设置描边颜色CanvasContext.setStrokeStyle 小程序画布设定阴影样式CanvasContext.setShadow 小程序画布设置全局画笔透明度CanvasContext.setGlobalAlpha 小程序画笔设置线条的宽度CanvasContext.setLineWidth 小程序画布设置线条的交点样式CanvasContext.setLineJoin 小程序画布设置线条的端点样式CanvasContext.setLineCap 小程序画笔设置虚线样式CanvasContext.setLineDash 小程序画布设置最大斜接长度CanvasContext.setMiterLimit 小程序画布在画布上绘制文本CanvasContext.fillText 小程序画布设置字体大小 小程序画布设置文字的对齐方式CanvasContext.setTextAlign 小程序画布设置文字的竖直对齐 小程序画布渐变对象CanvasGradient 小程序画布添加颜色的渐变点CanvasGradient.addColorStop 小程序画布颜色Color 小程序画布图片对象Image 小程序画布ImageData 对象 小程序画布离屏 canvas 实例OffscreenCanvas 小程序画布创建一个图片对象OffscreenCanvas.createImage 小程序画布获取OffscreenCanvas 的绘图上下文OffscreenCanvas.getContext 小程序画布Path2D 小程序画布Canvas 绘图上下文RenderingContext