使用方法
- 选择“渐变”或“按钮”标签页。
- 调整控件并观察实时预览：渐变可调整颜色、角度和类型；按钮可调整文字、颜色、内边距和圆角半径。
- 点击代码块上方的复制图标，将 CSS 粘贴到你的样式表中。
“渐变”标签页用两种颜色构建背景。你可以在线性渐变和径向渐变之间选择。线性渐变有一个 0 到 360 度的角度滑块。径向选项会生成从第一种颜色到第二种颜色的圆形渐变。预览下方的代码是一条 background 声明，例如带有角度和两个色标的 linear-gradient，可直接粘贴使用。
“按钮”标签页会输出一条名为 custom-button 的类的完整规则。你可以设置预览用的标签文字、背景色、文字颜色、水平和垂直内边距（各为 0 到 100 px）以及圆角半径（0 到 50 px）。生成的 CSS 包含你选择的颜色、内边距和圆角，另外还有无边框、指针光标、中等字重、短暂的透明度过渡，以及一条会略微降低透明度的悬停规则。
颜色可以用颜色控件选取，也可以作为文本输入。输出是纯 CSS，没有浏览器前缀，也不依赖任何框架，因此你可以在任何项目中使用并继续编辑。此工具不支持超过两个色标的渐变。
不会向服务器发送任何内容。预览和代码都是在你输入时于浏览器中生成的。
常见问题
我可以做三种或更多颜色的渐变吗？
不可以。此工具使用两种颜色。你可以通过编辑复制出的 CSS 来添加更多色标。
角度控件有什么作用？
对于线性渐变，它以度为单位设置方向。径向渐变始终是圆形的，因此该控件会被隐藏。
按钮 CSS 中的类名是什么？
生成的规则使用类 custom-button，你可以将其重命名以匹配你的项目。
它会为按钮添加悬停样式吗？
会。复制的 CSS 包含一条将透明度设为 0.9 的悬停规则。
我输入的任何内容会被上传吗？
不会。CSS 在你的浏览器中构建。