✓ 🍋
Menu
🍋 Peasy Tools
🍋 CSS Tools

CSS 渐变生成器

生成线性和径向 CSS 渐变

Free 仅在浏览器中 No sign-up
chars words sentences lines

Gradient Options

结果

结果

关于 CSS 渐变生成器

生成 CSS 线性渐变和径向渐变。可视化编辑颜色和方向。

工作原理

提供可视化编辑器来设置渐变方向、颜色和停止位置。实时预览渐变效果并生成对应的 CSS 代码。

分步教程

  1. 1 [
  2. 2 '
  3. 3 选
  4. 4 择
  5. 5 渐
  6. 6 变
  7. 7 类
  8. 8 型
  9. 9 (
  10. 10 线
  11. 11 性
  12. 12 /
  13. 13 径
  14. 14 向
  15. 15 )
  16. 16 '
  17. 17 ,
  18. 18
  19. 19 '
  20. 20 添
  21. 21 加
  22. 22 和
  23. 23 调
  24. 24 整
  25. 25 颜
  26. 26 色
  27. 27 停
  28. 28 止
  29. 29 点
  30. 30 '
  31. 31 ,
  32. 32
  33. 33 '
  34. 34 调
  35. 35 整
  36. 36 渐
  37. 37 变
  38. 38 方
  39. 39 向
  40. 40 或
  41. 41 角
  42. 42 度
  43. 43 '
  44. 44 ,
  45. 45
  46. 46 '
  47. 47 复
  48. 48 制
  49. 49 生
  50. 50 成
  51. 51 的
  52. 52
  53. 53 C
  54. 54 S
  55. 55 S
  56. 56
  57. 57 代
  58. 58 码
  59. 59 '
  60. 60 ]

提示

  • [
  • '
  • 4
  • 5
  • °
  • 角
  • 的
  • 线
  • 性
  • 渐
  • 变
  • 是
  • 最
  • 常
  • 用
  • 的
  • 渐
  • 变
  • 方
  • 向
  • 。
  • '
  • ,
  • '
  • 使
  • 用
  • 相
  • 近
  • 色
  • 调
  • 可
  • 以
  • 创
  • 建
  • 柔
  • 和
  • 的
  • 渐
  • 变
  • 过
  • 渡
  • 。
  • '
  • ,
  • '
  • 径
  • 向
  • 渐
  • 变
  • 适
  • 合
  • 创
  • 建
  • 高
  • 光
  • 和
  • 焦
  • 点
  • 效
  • 果
  • 。
  • '
  • ]

常见问题