---
name: "CanvasGradient.addColorStop"
mode: "api"
versionRequirements:
  - { name: "基础库", version: "2.21.8" }
title: "CanvasGradient.addColorStop - 添加渐变颜色断点"
---

## CanvasGradient.addColorStop

> [VERSION] 基础库 >= 2.21.8

### 描述

添加渐变颜色断点

### 参数

`Params`

| 参数 | 类型 | 必填 | 描述 |
| --- | --- | --- | --- |
| `position` | `number` | 是 | 断点位置，范围 0-1 |
| `color` | `string` | 是 | 颜色值 |

### 返回值

无


### 示例代码

#### 添加颜色断点

```ts
const ctx = ty.createCanvasContext('myCanvas');
const gradient = ctx.createLinearGradient(0, 0, 200, 0);
gradient.addColorStop(0, '#ff0000');
gradient.addColorStop(0.5, '#ffff00');
gradient.addColorStop(1, '#00ff00');
ctx.setFillStyle(gradient);
ctx.fillRect(0, 0, 200, 100);
ctx.draw();
```