instagram分享
Social login buttons, links to social media channels — in 2020 this is still a thing in web design and app design. I mean, what business isn’t on social media these days? It’s a necessity!
社交登录按钮，指向社交媒体渠道的链接—到2020年，这仍然是Web设计和应用程序设计中的一件事。 我的意思是，这些天社交媒体上没有从事什么业务？ 这是必须的！
Knowing what the different fonts and colors used by social networks are (so that we can use them in our designs) is quite handy. It’s something we “google” every time we design an app or website. (For example, “Facebook blue”, “Facebook hex value”, “What is the color used by Facebook?”, and so on).
知道社交网络使用的不同字体和颜色是什么(以便我们可以在设计中使用它们)非常方便。 每当我们设计一个应用程序或网站时，我们都会用它“谷歌”。 (例如，“ Facebook蓝色”，“ Facebook十六进制值”，“ Facebook使用什么颜色？”等等)。
In fact, I bet that’s how you found this article!
实际上，我敢打赌，这就是您找到这篇文章的方式！
Well, I won’t keep you waiting any more. Let’s take a look at the fonts and colors used by Messenger (by Facebook), Instagram (by Facebook), WhatsApp (by Facebook), Facebook itself, Twitter, Pinterest, LinkedIn, Snapchat, and finally, Google/YouTube.
好吧，我不会再让您等待了。 让我们看一下Messenger(通过Facebook)，Instagram(通过Facebook)，WhatsApp(通过Facebook)，Facebook本身，Twitter，Pinterest，LinkedIn，Snapchat和最终Google / YouTube使用的字体和颜色。
This article was updated in 2020 to show the newer fonts and colors used by social networks, including Facebook, Twitter, Instagram, and various others. Google+ didn’t make a comeback.
本文已于2020年更新，以显示社交网络(包括Facebook，Twitter，Instagram以及其他各种社交网站)使用的更新字体和颜色。 Google+没有卷土重来。
Quick note: system fonts (i.e. : system-ui in CSS) are the standard unless otherwise stated. For each medium, this means:
快速说明：除非另有说明，否则系统字体(即CSS中的: system-ui )是标准字体。 对于每种介质，这意味着：
Roboto for Android
Android版Roboto
Segoe UI for Windows
Windows的Segoe UI
San Francisco for iOS/macOS
适用于iOS / macOS的旧金山
Material design (i.e. YouTube and other Google apps) also uses Roboto. However, the actual Google logo uses Google’s very own Product Sans font (and this applies to the Alphabet logo too).
素材设计(例如YouTube和其他Google应用)也使用Roboto 。 但是，实际的Google徽标使用Google自己的Product Sans字体(这也适用于Alphabet徽标)。
Messenger hex value: #0084FF
Messenger十六进制值： #0084FF
Messenger RGB value: rgb(0 132 255)
Messenger RGB值： rgb(0 132 255)
Messenger on macOS uses Helvetica Neue instead of San Francisco, but everything else follows the system default.
macOS上的Messenger使用Helvetica Neue而不是San Francisco，但其他所有设置均遵循系统默认值。
Instagram hex value: #E1306C
Instagram十六进制值： #E1306C
Instagram RGB value: rgb(225 48 108)
Instagram RGB值： rgb(225 48 108)
Instagram uses many colors in their branding, although the color value mentioned above is the one used in their own examples.
尽管上面提到的颜色值是他们自己的示例中使用的一种颜色，但Instagram在其品牌中使用了多种颜色 。
WhatsApp hex value: #25D366
WhatsApp十六进制值： #25D366
WhatsApp RGB value: rgb(37 211 102)
WhatsApp RGB值： rgb(37 211 102)
Facebook hex value: #1877F2
Facebook十六进制值： #1877F2
Facebook RGB value: rgb(24 119 242)
Facebook RGB值： rgb(24 119 242)
Twitter hex value: #1DA1F2
Twitter十六进制值： #1DA1F2
Twitter RGB value: rgb(29 161 242)
Twitter RGB值： rgb(29 161 242)
Pinterest hex value: #E60023
Pinterest十六进制值： #E60023
Pinterest RGB value: rgb(230 0 35)
Pinterest RGB值： rgb(230 0 35)
Pinterest uses Helvetica/Neue Haas Grotesk for their website, but the default system font for everything else.
Pinterest将Helvetica / Neue Haas Grotesk用于他们的网站，但其他所有内容均使用默认系统字体。
Hex: #1666C5
十六进制： #1666C5
RGB: rgb(22 102 197)
RGB： rgb(22 102 197)
LinkedIn uses : Sans-Serif on their website, which means Helvetica first/Arial second/system default otherwise.
LinkedIn在其网站上使用: Sans-Serif ，这意味着Helvetica首先/ Arial其次/系统默认。
Hex: #FFFC00
十六进制： #FFFC00
RGB: rga(255 252 0)
RGB： rga(255 252 0)
Standing out from the herd, Snapchat uses the Graphik font!
Snapchat脱颖而出，使用Graphik字体！
Android, Google, and Google-owned apps such as YouTube use the design system known as Material Design, which makes references to several colors and also recommends the use of the Roboto font.
Android，Google和YouTube等Google拥有的应用程序使用称为Material Design的设计系统，该系统引用了多种颜色 ，并建议使用Roboto字体。
Hex: #FF0000
十六进制： #FF0000
RGB: rgb(255 0 0)
RGB： rgb(255 0 0)
Hex: #4285F4
十六进制： #4285F4
RGB: rgb(66 133 244)
RGB： rgb(66 133 244)
Hex: #EA4335
十六进制： #EA4335
RGB: rgb(234 67 53)
RGB： rgb(234 67 53)
Hex: #FBBC05
十六进制： #FBBC05
RGB: rgb(251 188 5)
RGB： rgb(251 188 5)
Hex: #34A853
十六进制： #34A853
RGB: rgb(52 168 83)
RGB： rgb(52 168 83)
Alphabet is the company that owns Google.
Alphabet是拥有Google的公司。
Hex: #ED1C24
十六进制： #ED1C24
RGB: rgb(52 168 83)
RGB： rgb(52 168 83)
Place this code snippet at the top of your CSS file to use the aforementioned social media brand colors (RGB) as CSS variables:
将此代码段放在CSS文件的顶部，以使用上述社交媒体品牌颜色(RGB)作为CSS变量：
:root { --messenger: 0 132 255; --instagram: 225 48 108; --whatsapp: 37 211 102; --facebook: 24 119 242; --twitter: 29 161 242; --pinterest: 230 0 35; --linkedin: 22 102 197; --snapchat: 255 252 0; --youtube: 255 0 0; }Then call them like this:
然后像这样称呼他们：
.social-icon.facebook { background-color: rgb(var(--facebook)); // without alpha background-color: rgb(var(--facebook) / 50%); // with alpha }Have a question? Something amiss? Shoot me a tweet on Twitter.
有一个问题？ 有什么不对吗？ 在Twitter上给我发一条推文 。
翻译自: https://www.sitepoint.com/fonts-colors-used-facebook-twitter-google/
instagram分享
相关资源：jdk-8u281-windows-x64.exe