Color Domain

The Color domain helps you work with Colors the way humans do.

Screens think in Red, Green, and Blue, but people think in Hue, Saturation, and Lightness. This domain lets you mix colors mathematically (e.g., primary + 10% lightness for a hover state) without the mud that comes from raw RGB math.

Overview

use aivi.color (Color)

primary = #007bff
// Mathematically correct lightening
lighter = primary + 10lightness

Features

Rgb = { r: Int, g: Int, b: Int }  // 0-255
Hsl = { h: Float, s: Float, l: Float }  // h: 0-360, s/l: 0-1
Hex = Text  // "#rrggbb"

Domain Definition

domain Color over Rgb = {
  type Delta = Lightness Int | Saturation Int | Hue Int
  
  (+) : Rgb -> Delta -> Rgb
  (+) col (Lightness n) = adjustLightness col n
  (+) col (Saturation n) = adjustSaturation col n
  (+) col (Hue n) = adjustHue col n
  
  (-) : Rgb -> Delta -> Rgb
  (-) col delta = col + (negateDelta delta)
  
  // Delta literals
  1l = Lightness 1
  1s = Saturation 1
  1h = Hue 1
}

Helper Functions

Function	Explanation
adjustLightness color amount Rgb -> Int -> Rgb	Increases or decreases lightness by a percentage.
adjustSaturation color amount Rgb -> Int -> Rgb	Increases or decreases saturation by a percentage.
adjustHue color degrees Rgb -> Int -> Rgb	Rotates hue by degrees.
toRgb hsl Hsl -> Rgb	Converts HSL to RGB.
toHsl rgb Rgb -> Hsl	Converts RGB to HSL.
toHex rgb Rgb -> Hex	Renders RGB as a hex string.

Usage Examples

use aivi.color

primary = { r: 255, g: 85, b: 0 }  // Orange

lighter = primary + 10l
darker = primary - 20l
muted = primary - 30s
shifted = primary + 30h