Color

Gradients, Hypercolor, Huetone & Prism are useful.

Color and Contrast is a good read.

Nice gradients

• 1
• 2
• Arc

Notes

• #F9F9F9 is nice white color instead of #FFFFFF

Links

• Color Hunt
• Handpicked list of 18181 unique color names from various sources and thousands of user submissions
• Colormind - Color scheme generator that uses deep learning.
• Building Your Color Palette (HN)
• Cloudflare Design - Preview palettes against UI elements.
• pastel - Command-line tool to generate, analyze, convert and manipulate colors.
• Image Color Picker - Image color picker and palette generator.
• Contrast - MacOS app for quick access to WCAG color contrast ratios.
• Sip - Better way to collect, organize & share your colors.
• Designing accessible color systems (2019)
• SRCERY - Dark color scheme.
• Who can use this color combination?
• Happy Hues - Color palette inspiration site that acts as a real world example as to how the colors could be used in your design projects. (Nice palette)
• The Hitchhiker's Guide to Digital Color - Light-hearted introduction to understanding digital color reproduction.
• Brown; color is weird (2020) (HN)
• The Weird World in RGB (2019)
• Pywal - Tool that generates a color palette from the dominant colors in an image.
• HSLuv, a developer friendly perceptual color space (2020)
• HSLuv - Human-friendly HSL. (Code) (rust-hsluv)
• colors.lol - Overly descriptive color palettes. (Code) (HN)
• Color gradient generator
• Not Another Gradient Generator - Create complex, layered color gradients as CSS, SVG, or Raster Images.
• Building dark mode on Stack Overflow (2020) (HN)
• Duo - Collection of color combinations that I've curated from personal projects or that I've come across on the web. (HN)
• color-scheme.js - Generate nice, pretty color schemes with JavaScript. (Code)
• Themer - Takes a set of colors and generates themes for your development environment (editors, terminals, wallpapers, and more). (Code)
• Color Names - Collaborative effort to name every color in the RGB/web space. (HN)
• Chromotome - Collection of color palettes saved for personal use. (Code)
• Research links on color theory (2020)
• A short history of color theory
• 35+ white paint colors that top designers swear by
• Scale - Generative way to create color scales. (Code)
• Sanzo Wada - Dictionary of Color Combinations. (Code)
• Palettes from A Dictionary of Colour Combinations
• Color Copy Paste - Copy & paste colour directly from your camera to Figma/Sketch/Chrome. (Code)
• Perceptually Smooth Multi-Color Linear Gradients (2020)
• Piggment - The gradient you have always wanted.
• Material Design Palette Generator (Code)
• Colour Theory On 80 Display Boards (1944)
• Color Palette Generator
• Coolors - Super fast color schemes generator.
• atcq - Implementation of Ant-Tree Color Quantization (ATCQ), described by Pérez-Delgado in various papers.
• Color contrast checker, analyser and color suggestions
• Adobe Color - Color wheel, a color palette generator.
• iroiro - Beautiful Colors Lookup in CLI.
• consistent-shading - Shade consitency for various hues, based on luminance.
• Sorted CSS Colors - Sort the named CSS colors in a way that it shows related colors together. (Code)
• Cascading Colors - Generate dynamic and themable color palettes using CSS custom properties, and allow (persistent) user-adjustments with a bit of light-weight JS. (Code)
• Basic Color Science For Graphics Engineer (2018)
• Bjango Color Creator Templates - Photoshop, Sketch and Affinity Designer documents that use base colors to generate larger palettes.
• Palettte App (Explanation)
• Reasoning about colors (2020) (Lobsters)
• How do humans perceive color? (2020)
• Random Color Cycler (Code)
• Colorable - Color combination contrast tester. (Code)
• How software gets color wrong (2020)
• Random color generator for JavaScript (Code)
• Practical Color Theory for People Who Code (2016)
• Color Craft & Counterpoint: A Designer’s Life with Color Vision Deficiency (2020)
• Conic.css - Nice, simple conic gradients. (Code)
• HSL: a color format for humans (2021)
• Mesh - Create beautiful mesh gradients.
• Poulette - Color Palette GUI. (Demo) (HN)
• Colord - Tiny yet powerful tool for high-performance color manipulations and conversions.
• A Guide to Color from 1692 (HN)
• Paletter - Create professional color palettes. (HN)
• culori - Comprehensive color library for JavaScript. (Web)
• Mindfully curated color palettes - Collection of unique color combinations for your design projects.
• Towards richer colors on the Web (2021) (HN)
• Radix Colors - Gorgeous, accessible color system. (Web)
• Cone - Live Color Picker.
• 100 Mesh Gradients - Make your website beautiful with mesh gradients.
• Using HSL Colors In CSS (2021)
• How to make nice gradients in CSS
• Why we're blind to the color blue (HN)
• How WCAG color contrast ratio works (2021)
• colorful gradients - Gradients automatically created by a computer.
• Accessible Colors - Automatically find the closest accessible color combination. (Code)
• ColorBox
• color-algorithm - JavaScript function for producing color sets. Used to build Lyft's color system (Spectrum) and power ColorBox.
• An interactive review of Oklab (2021)
• New alternatives to HSL and HSV that better match color perception (HN)
• Accessible Palette - Create color systems with consistent lightness and contrast. (Tweet)
• Accessible Palette: Stop using HSL for color systems (2021)
• NO_COLOR - Disabling ANSI color output in various Unix commands. (Code)
• FettePalette - Color palette generation function using curves within the HSV color model.
• The Geometry of Color Perception (HN)
• CSS gradient resampler
• Sunlight affects whether languages have a word for ‘blue’ (2021) (HN)
• Huetone - Tool to create and fine-tune your color system.
• colorio - Tools for color research.
• LCH Color picker (Code) (Tweet)
• Pick a color (Code)
• Color Accessibility for Tailwind CSS (Code)
• Shadowlord - Tints and Shades Generator Tool. (Code)
• Harmonic Coloring - Method for assigning colors to musical pitches. (HN)
• A Guide To Modern CSS Colors With RGB, HSL, HWB, LAB And LCH (2021)
• Inkspot - Small Clojure/ClojureScript library for creating color swatches.
• Dynamic Color Manipulation with CSS Relative Colors (2021) (Tweet)
• Every Color Picker - Color picker components. Framework independent. (Code)
• dominant_colours - CLI tool to find the dominant colors in an image.
• Design Tip: Never Use Black by Ian Storm Taylor (2012) (HN)
• Coloring With Code — A Programmatic Approach To Design (2021)
• Color-changing magnifying glass gives clear view of infrared light (2021) (HN)
• Base16 - Architecture for building color themes for many apps. (HN)
• WCAG 3's new color contrast method called APCA (Advanced Perceptual Contrast Algorithm)
• Huetone - Tool to create accessible color systems. (Code) (Tweet)
• APCA (Advanced Perceptual Contrast Algorithm) - New method for predicting contrast for use in emerging web standards (WCAG 3) for determining readability contrast. (Web)
• How we will write colors in CSS in 2022-2023 (Russian)
• colorgram.py - Python library that lets you extract colors from images.
• TinyColor - Fast, small color manipulation and conversion for JavaScript.
• Color-Description - Turns a technical color representation into a human readable description. (Code)
• Shade Generator - Generate shades and tints of a given input color. (Code)
• Colorquant - Go library for color quantization and dithering.
• Polychroma - Better gradients through color spaces. (Code)
• Design Gradients - Free platform of 48 linear gradients curated by designers.
• ColorSchemes.jl - Color schemes, colormaps, gradients, and palettes.
• Meshy - Design tool to generate beautiful & colorful mesh gradients. (Code)
• CSS Gradient Generator
• Color-space - Math & data behind color spaces and color conversions.
• Leonardo - Generate colors based on a desired contrast ratio.
• A Pixel's Color (HN)
• hue.tools - Open-source toolbox for colors. (Code) (HN)
• OKLCH Color Picker
• Every Color - Example site which uses Netlify's On-Demand Builders to generate millions of color reference pages. (Code)
• Vue gradient picker component (Code)
• Huemint - AI color palette generator. (HN)
• Open Source Color System
• 60-30-10 Color Rule
• colo - Displays colors in various color spaces.
• Simpler Color - Create your own complete color system fast and easy. (HN)
• Meshed Up - Collection of multi-color vectors for web developers and digital designers.
• Chroma.js - JavaScript library for all kinds of color manipulations.
• Colour - Python package providing a comprehensive number of algorithms and datasets for color science.
• A detailed guide to colors in data vis style guides (2022)
• Nord Palette - Arctic, north-bluish color palette. (Code)
• uiGradients - Beautiful colored gradients. (Code)
• Stripe Gradient Effect (Code)
• Pigmnts - Color palette generator from an image using WebAssesmbly and Rust.
• Whatamesh - Easily create mesh gradients like Stripe. (Code)
• color-contrast - Visualizing relative luminance contrast within sRGB colorspace.
• Reasonable Colors - Open-source color system for building accessible, nice-looking color palettes. (Code)
• node-vibrant - Extract prominent colors from an image.
• color.js - Extract colors from an image.
• Hypercolor - Gradients for Tailwind CSS. (Code)
• Mesh Gradients inside Sketch
• Web color is still broken (HN)
• OKLCH Color Picker (Tweet)
• Why OKLCH is the future of colors in CSS
• The Color API - Pass in any valid color and get conversion into any other format, the name of the color, placeholder images and a multitude of schemes. (Code)
• distinctipy - Lightweight package for generating visually distinct colors.
• Plasma - Eye-candy pixel plasma randomized generator - for the desktop and the web. (Code)
• Image editors often get color wrong (2022) (HN)
• Thread about canvas rendering optimization for the OKLCH color picker
• theme-colors - Easily generate color shades for themes.
• Benjamin Moore Paints as CSS Colors (Code)
• How to pick the least wrong colors (2022)
• Ambient - Generate contrast-safe colors for UI/UX. (Code)
• Primer Prism - Tool for creating and maintaining cohesive, consistent, and accessible color palettes. (Code)
• Accelerating GitHub theme creation with color tooling (2022)
• Color Thief - Grab the color palette from an image using just JavaScript. Works in the browser and in Node.
• Gradient Avatars - Generate a gradient profile image based on some text. (Code)
• Color.js - Color conversion & manipulation library by the editors of the CSS Color specifications. (Code) (Article) (Article) (Color.js Released) (HN)
• Easing Gradients (Code)
• Better Color Tools - Color parser and better color manipulation through the power of science. Uses Oklab/Oklch for better color operations.
• colornamer - Given a color, return a hierarchy of names.
• 365 days of color
• a11y-color-contrast - TypeScript package to calculate WCAG 2.0/3.0 and APCA color contrasts.
• Gradientos - Makes it easy to choose gradients. (Code)
• Iris - CLI tool that creates color palettes from images using the median cut algorithm.
• Color Gradient - High-performance JavaScript color gradient library powered by Rust + WebAssembly. (Code)
• Penumbra Color Theme - Perceptually optimized color palette based on natural light. (HN)
• Fast Average Color - Fast Average Color.
• Color and Contrast - Interactive guide to color & contrast. (Tweet)