matheus23 / elm-tailwind-modules-base / Tailwind.Color

Tailwind Color and Opacitites Module

This module contains some internal utilities, which elm-tailwind-modules-generated code uses as well as some functions for generating custom colors and opacities for use with elm-tailwind-modules-generated code.

Colors


type Color
    = Color String String String String Opacity
    | Keyword String

The type for tailwind colors.

You should never need to construct values of this type manually. If you find the need to do so, use arbitraryRgb or similar functions instead.

Values of this type can usually be found in your elm-tailwind-modules-generated Theme.elm module.

They can be used with tailwind utility functions like bg_color.

arbitraryRgb : Basics.Int -> Basics.Int -> Basics.Int -> Color

Construct a Color value from red, green, and blue values (each between 0 and 255).

arbitraryRgba : Basics.Int -> Basics.Int -> Basics.Int -> Basics.Float -> Color

Construct a Color value from red, green, and blue values (each between 0 and 255) and an opacity value between 0 and 1.

Opacities


type Opacity
    = Opacity String
    | ViaVariable

The type for tailwind opacities.

You should never construct values of this type manually. If you find the need to do so, use arbitraryOpacityPct instead.

Values of this type can usually be found in your elm-tailwind-modules-generated Theme.elm module.

They can be used to modify the default opacities associated with colors using the withOpacity function.

withOpacity : Opacity -> Color -> Color

Attach an opacity to a color.

arbitraryOpacityPct : Basics.Int -> Opacity

Construct an Opacity value from a given percentage (between 0 and 100), where 0 means transparent and 100 means opaque.

Internal

These functions are only meant to be used in generated code.

propertyWithColor : String -> (String -> String) -> Maybe String -> Color -> Css.Style

This is an internal function used by elm-tailwind-modules to generate the tailwind utilities in Utilities.elm.

You should never need to use these yourself.