# 一、使用工具
渐变色参考:[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)