Important: This documentation is about an older version. It's relevant only to the release noted, many of the features and functions have been updated or replaced. Please view the current version.
colorManipulator.getContrastRatio() function
This API is provided as a preview for developers and may change based on feedback that we receive. Do not use this API in a production environment.
colorManipulator.getContrastRatio() function
Calculates the contrast ratio between two colors.
Formula: https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
Signature
export declare function getContrastRatio(foreground: string, background: string, canvas?: string): number;
Import
import { colorManipulator } from '@grafana/data';
const { getContrastRatio } = colorManipulator;
Parameters
Parameter | Type | Description |
---|---|---|
foreground | string | CSS color, i.e. one of: #nnn, #nnnnnn, rgb(), rgba(), hsl(), hsla() |
background | string | CSS color, i.e. one of: #nnn, #nnnnnn, rgb(), rgba(), hsl(), hsla() |
canvas | string | A CSS color that alpha based backgrounds blends into |
Returns:
number
A contrast ratio value in the range 0 - 21.