Skip to content

GradientText 渐变文字

以渐变色填充文字的纯展示组件,background-clip: text 实现;默认走主题 token 双色渐变,支持任意色标数组与方向。无事件。

基础用法

默认 token 渐变(to right)

渐变文字

自定义色标

红→蓝 双色

红蓝渐变

三色渐变

三色渐变

方向

direction=to bottom

自上而下

direction=135deg

斜向渐变

API

属性

属性说明类型默认值
direction渐变方向(linear-gradient 第一参数,如 to right135degstring
gradientJSON 色标数组,如 ["#f00","#00f"];单个色标渲染纯色;缺失/非法回退默认 token 渐变string

插槽

名称说明
默认
  • 默认渐变使用主题 token(--oas-color-primary--oas-color-primary-hover),随亮暗主题自动切换,无硬编码色值。
  • 色标条目经白名单校验,防止 CSS 注入。
  • 无事件,纯展示。