Question

我在移动客户端上的深色模式下出现Gmail问题，即它使用的颜色选择。

如果我将绿色background-color: #00ff00;指定为背景色，则深色模式下的Gmail会将值更改为深绿色background-color: #1c4211;。这不是我选择深绿色的首选。我正在寻找自定义颜色的方法。

我尝试专门通过以下类来定位Gmail：u ~ div td background-color: #00ff00;。对于某些颜色选择（例如红色），它遵循颜色选择。在许多其他情况下，它可以代替无法满足我的预期需求的深色。

有人解决方案可以微调交换过程吗？

Answer 1

对于iPhone上的gmail应用，我发现具有多个渐变的hsl颜色可以解决问题，就像这样：

background: #10c893;
background: -moz-linear-gradient(top,  hsl(163,85%,42%) 0%, hsl(163,85%,42%) 100%);
background: -webkit-linear-gradient(top,  hsl(163,85%,42%) 0%,hsl(163,85%,42%) 100%);
background: linear-gradient(to bottom,  hsl(163,85%,42%) 0%,hsl(163,85%,42%) 100%);

Answer 2

我们使用的另一种解决方案是创建一个 1px 的 gif，并将其用作我们想要强制为特定颜色的容器的背景图像。

<td style="background-image: url('https://path-to-image-here/pixel-ffffff.gif'); background-repeat:repeat;">
                    <div>
                        THIS HAS A WHITE BACKGROUND IN DARK MODE NOW!
                    </div>
                </td>

我们唯一还没有弄清楚的是如何强制字体颜色不反转。认为我们会稍微改变我们的设计并使用灰色而不是黑色，希望 gmail 不会反转它。

Answer 3

混淆了@Iggy 的回答，我发现 hsl 颜色不是必需的，使用 linear-gradient 现在 widely supported，我们可以像这样更简单地指定背景颜色：

background: #fff;
background: linear-gradient(#fff, #fff);

我在 litmus.com 的 Android 和 iOS Gmail 应用中对此进行了测试。

在深色模式下控制Gmail中的颜色交换

3 个答案: