🎨 Reynard Color Types

Shared color type definitions for the Reynard ecosystem.

Overview

This package provides all color-related types and constants used across the Reynard framework, eliminating circular dependencies and ensuring consistent color type definitions.

Features

• OKLCH Color Types: Perceptually uniform color space definitions
• Theme Types: Theme names, variants, and configurations
• Color Conversion Types: RGB, HSL, HSV, LAB color space interfaces
• Colorblind Accessibility: Comprehensive color vision deficiency support
• Constants: Theme names, color ranges, and validation constraints
• Type Safety: Full TypeScript support with strict type checking

Installation

pnpm add reynard-color-types

Usage

Basic Types

import type { OKLCHColor, ThemeName, RGBColor } from "reynard-color-types";

const color: OKLCHColor = { l: 60, c: 0.25, h: 240 };
const theme: ThemeName = "dark";
const rgb: RGBColor = { r: 255, g: 0, b: 0 };

Theme Constants

import { THEME_NAMES, DEFAULT_THEME, isValidThemeName } from "reynard-color-types";

// Get all available themes
console.log(THEME_NAMES); // ["dark", "light", "gray", "banana", "strawberry", "peanut"]

// Check if theme is valid
if (isValidThemeName(userTheme)) {
  // Safe to use userTheme as ThemeName
}

Color Ranges

import { OKLCH_RANGES, WEB_SAFE_CONSTRAINTS } from "reynard-color-types";

// Validate OKLCH color values
const isValidLightness = (l: number) => l >= OKLCH_RANGES.lightness.min && l <= OKLCH_RANGES.lightness.max;

Colorblind Accessibility

import type {
  ColorVisionDeficiency,
  ColorblindSeverity,
  ContrastResult,
  ColorAccessibilityAssessment,
} from "reynard-color-types";
import { COLORBLIND_MATRICES, WCAG_THRESHOLDS, COLORBLIND_FRIENDLY_HUES } from "reynard-color-types";

// Define colorblind configuration
const deficiency: ColorVisionDeficiency = "protanopia";
const severity: ColorblindSeverity = "moderate";

// Check WCAG compliance
const contrastResult: ContrastResult = {
  ratio: 4.5,
  aaCompliant: true,
  aaaCompliant: false,
  normalText: true,
  largeText: true,
};

API Reference

Types

• OKLCHColor - OKLCH color interface
• OKLCHAColor - OKLCH color with alpha
• ThemeName - Theme name union type
• RGBColor - RGB color interface
• HSLColor - HSL color interface
• HSVColor - HSV color interface
• LABColor - LAB color interface
• ColorVisionDeficiency - Color vision deficiency types
• ColorblindSeverity - Severity levels for colorblind simulation
• ContrastResult - WCAG contrast analysis results
• ColorAccessibilityAssessment - Comprehensive accessibility assessment

Constants

• THEME_NAMES - All available theme names
• DEFAULT_THEME - Default theme name
• OKLCH_RANGES - OKLCH color value ranges
• WEB_SAFE_CONSTRAINTS - Web-safe color constraints
• COLORBLIND_MATRICES - Colorblind simulation matrices
• WCAG_THRESHOLDS - WCAG contrast ratio thresholds
• COLORBLIND_FRIENDLY_HUES - Accessible hue ranges for colorblind users
• ACCESSIBLE_CHROMA_RANGES - Chroma ranges for accessibility
• ACCESSIBLE_LIGHTNESS_RANGES - Lightness ranges for accessibility

Utilities

• isValidThemeName() - Validate theme name
• getThemeCategory() - Get theme category (dark/light)
• getThemesByCategory() - Get themes by category

Contributing

This package is part of the Reynard ecosystem. Please follow the project's contribution guidelines.

License

MIT