-
Notifications
You must be signed in to change notification settings - Fork 3
Colors
Choosing the right colors is the key for a good design. That is why Material-Design has standardized a color palette, yet this palette is HUGE! and you can use any two colors in your project.
To make your life easier Material-Love gives you an easy tool to pick colors by their name.
Simply require colors.lua
in your project
local color = require "material-love.libs.colors"
Using color
as a function is the same as calling color.main
color.main
expects two arguments, the first is the color name
and the second is the color variation
(if this one is not present it defaults to 500
)
The color name
should be in the format "red"
, "cyan"
, "deep-purple"
and such
The color variation
should be a number or string indicating the variation 500
, "A200"
, "900"
and such
colors.lua
exposes the whole set of colors, plus all the variation found on this page.
You will find that "white"
and "black"
colors dont support color variations
in color.main
, instead you should use color.mono
which handles just this two colours.
color.mono
also expects a color name
(limited to "white"
and "black"
) and a color variation
that should be one of the following
-
"full"
: The full color, that is with alpha255
-
"divider"
: The color used for dividers -
"disabled"
: The monochrome color used for disabled items -
"inactive-icon"
: The color used when rendering inactive icons -
"hint-text"
: The color you should use for hint text -
"secondary-text"
: The color used for text that is second in importance -
"icons"
: The color used when rendering active icons -
"text"
: The color used to draw main text
Check this for info on when to use each color
In addition to this list color.mono
also supports Text colors
color.mono
also exposes text colors, that is which color should be used for each type of text.
The usage is the same, first the color name
(either "black"
or "white"
) and then the variation
which must be a valid text type, that is:
-
"display"
: Valid for all the display types (display4
,display3
,display2
anddisplay1
) "headline"
"title"
"subhead"
-
"body"
: Valid for bothbody2
andbody1
"caption"
"menu"
"button"
This is based on this part of the spec
The background colors for the light and dark color schemes are grey:50
and blue-grey:800
respectively, and you can easily access this colors using the color.background
function.
It expects just one argument, "light"
or "dark"
.
There are two useful functions to list all the colors and all their variations, this are color.list
and color.variations
The first one takes no arguments, and returns a table with the colors names as values (numbers as keys).
The second one takes a color name
as argument and returns all the available variations as values in a table (numbers as keys). This is useful because some colors dont have alternative colors (A###
).
Gamma correction is now performed internally
The only needed file is libs/colors.lua