Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Percent color in Android for Material Design

In Google's spec for material design, I see colors specified as percentages:

To convey a hierarchy of information, you can use different shades for text. The standard alpha value for text on a white background is 87% (#000000). Secondary text, which is lower in the visual hierarchy, should have an alpha value of 54% (#000000).

I don't understand how these percentages work. For example, if the background color is white, what is the color of the text?

What if my background were say #607D8B. What would my text color be? Is it just the background color with the opacity (alpha) set to the percentage?

like image 312
Johann Avatar asked Apr 09 '15 06:04

Johann


People also ask

What color formats are supported for color resources in android?

red(int) to extract the red component. green(int) to extract the green component. blue(int) to extract the blue component.

What is the most readable color combination?

Their general findings were: 1) Black and white were consistently rated as the most readable; 2) Color combinations that included black were rated more readable than those that did not; and 3) Darker text on lighter backgrounds were rated higher than lighter text on darker backgrounds.

What is colorPrimary and colorPrimaryVariant?

colorPrimary and colorSecondary represent the colors of your brand. colorPrimaryVariant and colorSecondaryVariant are lighter or darker shades of your brand colors. colorSurface is used for “sheets” of material (like cards and bottom sheets)


1 Answers

The percentage are for visibility of the color

When we specify any color using hex format :

First 2 digit : visibility

After 6 digit : RRGGBB

So, the calculation example is :

(87)% of (100) decimel = 87 %   ->    convert to (87)% of (256) in hex 222.72 rounding to 223 which is (DF) in hex

So your color code = #DF607D8B -- primary

Same way, any perentage should be converted to hex

You can check table : here

like image 50
Kushal Avatar answered Oct 08 '22 11:10

Kushal