myeclipse深色模式
重点 (Top highlight)
暗模式起作用。 (Dark Mode is functional.)
Mainly, due to the following 2 reasons:
主要是由于以下两个原因：
Helps, reduce battery drain significantly (on OLED phones that is… “why so?” discussed below)
有助于显着减少电池消耗(在OLED手机上，这是……“为什么？”在下面讨论)
Is relaxing (and hence more appealing) to the eye, especially when most of us have our eyes glued to the monitor 8 hours a day and no longer want to bear the white-strain at night.
使眼睛放松(因此更具吸引力)，尤其是当我们大多数人一天8小时将眼睛粘在显示器上并且不再希望在夜间承受白色疲劳时。
Choosing the right colors can convey information intuitively and invoke desired emotions. In this part of the Dark Mode UI Design series, we would be looking at choosing the background and action colors for your next design (Dark UI). For referential purposes, we would be applying our colors to some base components from the Material Design component gallery.
选择正确的颜色可以直观地传达信息并激发所需的情感。 在“ 黑暗模式UI设计”系列的这一部分中，我们将研究为下一个设计(Dark UI)选择背景和动作颜色 。 出于参考目的，我们会将颜色应用于Material Design组件库中的某些基础组件。
中性/灰色(设置应用的气氛和色调) (Neutrals/Greys (Sets the mood and tone of the app))
Neutrals are the colors you will use the most and will make up the majority of your UI. Use them for most of your text, backgrounds, and borders, as well as for things like secondary buttons and links.
中性是您将使用最多的颜色，并且将构成用户界面的大部分。 将它们用于您的大多数文本，背景和边框，以及辅助按钮和链接之类的东西。
In practice, you want 8–10 shades to choose from. Not so many that you waste time deciding between shade #45 and shade #46, but enough to make sure you don’t have to compromise too much.
实际上，您希望选择8–10种阴影。 不会浪费太多时间在＃45号阴影和＃46号阴影之间进行选择，但是足以确保您不必付出太多折衷。
Neutrals/Background shade can be defined into 2 categories:
中性/背景色光可以被定义成两类 ：
- Pure Neutrals 纯中性
- Accented Neutrals 重音中性
纯中性 (Pure Neutrals)
You could use a pure greyscale, a common palette widely endorsed by material design:
您可以使用纯灰度，这是材料设计广泛认可的通用调色板：
材质灰色调色板 (Material Grey Palette)
Here, much emphasis is given on the colors itself and not the dark mode, hence having an equal balance between whites (#50 ➡ #300) and greys (#400 ➡ #900).
这里，重点是颜色本身而不是深色模式，因此在白色(＃50➡＃300)和灰色(＃400➡＃900)之间具有相等的平衡。
Furthermore, for the background shade, you could also use the dark backgrounds as provided by the Material Design Guidelines
此外，对于背景阴影，您也可以使用《材料设计指南》中提供的深色背景
The recommended dark theme surface color by Material Design is:
Material Design建议的深色主题表面颜色为：
Dark Grey — #121212.
深灰色 —图库照片＃121212。
您也可以使用B 缺乏作为背景色： (You could also use Black as the background color:)
Advantage: On OLED screens, it can help save battery anywhere from 45–60% as the LED’s are physically turned off when black.
优点：在OLED屏幕上，由于黑色时LED的物理关闭状态，因此可以帮助节省45-60％的电量。
Disadvantage: If the UI undergoes a lot of movement, then it may cause motion blur due to the fact that LED’s have to be turned on every time they encounter any other color.
缺点：如果UI进行了很多移动，则可能会导致运动模糊，这是因为LED每次遇到任何其他颜色都必须打开。
The above palette can be tweaked by all means until the palette strikes a chord with you...
可以对上面的调色板进行微调，直到调色板与您和弦为止。
深灰色调色板 (Darker Grey Palette)
This grey palette is a darker shade of the above palette giving less importance to the contrast and more importance towards a unified, dark look.
灰色调色板是上述调色板的较暗阴影，它对对比度的重视程度较低，而对于统一的深色外观则更为重要。
重音中性 (Accented Neutrals)
This being said, you could also use accented neutrals instead of a pure-grey palette, which I personally recommend using due to 2 main reasons,
话虽如此，您也可以使用带重音的中性色来代替纯灰色调，我个人建议使用此调色有两个主要原因，
Pure greys are not found naturally, and so its a good option to have some tint on those neutrals to give it a more natural vibe.
纯天然的灰色不是自然发现的，因此对这些中性色进行一些着色以使其具有更多色彩是一个不错的选择 自然的氛围 。
Tinted neutrals, could help give the UI an overall emphasized tone and emotion to look forward to.
浅色的中性色可以帮助UI增强整体色彩和期待的情感。
重音中性 (Accented Neutrals)
Blue Grey: Trust, security, and authority…
蓝灰色：信任，安全和权威……
Cool Grey: Soothing, peaceful, healing, safe…
凉爽的灰色：舒缓，和平，康复，安全……
Warm Grey: Royal, comfort, earthy, stable…
暖灰色：皇家，舒适，朴实，稳定...
These palettes need not be necessarily used but they give a good starting point to explore further.
这些调色板不必一定要使用，但是它们为进一步探索提供了良好的起点。
辅助/使用面板 (Secondary/Usage Palette)
This palette is generally used to define colors for action items, messages, prorities, statuses, connectivity etc.
此调色板通常用于定义操作项，消息，属性，状态，连接性等的颜色。
I would be sharing some amazing complete color palettes for dark mode, in Part 2 of this series, so be sure to check that out once it comes.
在本系列的第2部分中，我将分享一些用于深色模式的令人惊叹的完整调色板，因此请确保在出现后立即检查一下。
Once the general action colors have been decided, its better to have some lighter and darker shades for every color. Eg:
一旦确定了一般的活动颜色，最好为每种颜色使用一些较浅和较深的阴影。 例如：
Finally, you would have a color palette somewhat like this:
最后，您将获得一个类似于以下的调色板：
Now, what’s not included in this article is the fact that you could choose 1 or 2 primary colors, to begin with, to make your application UI resemble your brand better. These colors determine the overall look of the site — the ones that make you think of Coca-Cola as “red”.
现在，本文没有包括的事实是，您可以选择1或2种原色，以使您的应用程序UI更像您的品牌。 这些颜色决定了网站的整体外观-使您将可口可乐视为“红色”的那些颜色。
Bdw, if you check out my website compilezero.com, you would be able to see the way I have used light and dark theme color palettes.
顺便说一句，如果您查看我的网站compilezero.com ，您将能够看到我使用浅色和深色主题调色板的方式。
I will be covering this topic and the importance of color-culture in the next article (Part 2: Color Palettes with examples) and would add the link here once it's complete.
我将在下一篇文章(第2部分：带有示例的调色板)中讨论这个主题以及颜色文化的重要性，并在完成后在此处添加链接。
Until then, please comment below if you feel something important points were left out and need to be addressed, and I will try my best to cover them in the coming articles.
在此之前，如果您觉得有什么要点遗漏并且需要解决，请在下面发表评论 ，我将尽力在接下来的文章中进行介绍。
翻译自: https://uxdesign.cc/dark-mode-ui-design-the-definitive-guide-part-1-color-53dcfaea5129
myeclipse深色模式
142
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
