Skip to content

Instantly share code, notes, and snippets.

@jouderianjr

jouderianjr/main.md

Created July 21, 2020 14:06
Show Gist options
  • Save jouderianjr/676caa2d82578da4c733d2ba45e97895 to your computer and use it in GitHub Desktop.
Save jouderianjr/676caa2d82578da4c733d2ba45e97895 to your computer and use it in GitHub Desktop.
Download ZIP
Raw
main.md

You will generate colors using a combination of 2 types, Tone and Brightness, and the function you should use is Palette.color.

Example:

Palette.color Palette.toneDanger Palette.brightnessMiddle

After having a Color you have 2 ways to use it, transform in a Element.Color or transform in a String that can be used along Html.Attributes.

Example:

Palette.color Palette.toneDanger Palette.brightnessMiddle
    |> Background.color

UI.Palette has 5 different tones (toneGray, tonePrimary, toneSuccess, toneWarning and toneDanger) and 5 different brightnesses (brightnessDarkest, brightnessMiddle, brightnessLight, brightnessLighter, brightnessLightest).

For more information, check the docs """

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment