🔥码云GVP开源项目 12k star Uniapp+ElementUI 功能强大 支持多语言、二开方便! 广告
# 一、使用工具 渐变色参考:[https://uigradients.com/#Wiretap](https://uigradients.com/#Wiretap) # 二、效果演示 设置效果(一) ![](https://img.kancloud.cn/1c/d9/1cd9ec5539f1a7e415218ec3a632eb4e_435x383.png) 设置效果(二) ![](https://img.kancloud.cn/1d/07/1d0796ec75e41c880a124be2641ade28_419x337.png) # 三、设置方法 1、将小程序升级到3.9.34版本以上/ 2、点击参数设置可以看到 “顶部导航渐变色左侧颜色”、“顶部导航渐变色右侧颜色”、“顶部导航文本颜色” 三个选项 ![](https://img.kancloud.cn/e2/d7/e2d7d6fc1b956753d6689be6da693a97_750x220.png) 3、点击 “顶部导航渐变色左侧颜色” 选择想要的颜色代码或者输入想设置的渐变色左侧代码号,如我们此处输入 #f953c6 ,点后点击确认 4、点击 “顶部导航渐变色左侧颜色” 选择想要的颜色代码或者输入想设置的渐变色左侧代码号,如我们此处输入 #b91d73 ,点后点击确认 5、“顶部导航文本颜色” 我们默认为白色 代码 #FFFFFF 6、点击提交按钮,然后预览小程序效果如下 ![](https://img.kancloud.cn/69/92/6992ecf86f9421f520ba776458ace837_571x590.png) 7、如果想设置单一颜色,将“顶部导航渐变色左侧颜色”、“顶部导航渐变色右侧颜色”设置为相同的即可,如我们设置成红色 代码 #FF0000 ![](https://img.kancloud.cn/b9/90/b990540486afe5e6587c3b38b98c41b9_750x314.png) 8、效果如下 ![](https://img.kancloud.cn/f5/74/f5743a209571b2baf081ce4e0449e73e_750x516.png) 9、顶部颜色设置 ![](https://img.kancloud.cn/0f/08/0f08b60a04aba616e1a1e87c6dd0debe_750x573.png) 10、效果如下 ![](https://img.kancloud.cn/8d/0a/8d0a9d4b6df3b76abc78480b6584e4ee_750x603.png)