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

  1. export declare function getContrastRatio(foreground: string, background: string, canvas?: string): number;

Import

  1. import { colorManipulator } from '@grafana/data';
  2. const { getContrastRatio } = colorManipulator;

Parameters

ParameterTypeDescription
foregroundstringCSS color, i.e. one of: #nnn, #nnnnnn, rgb(), rgba(), hsl(), hsla()
backgroundstringCSS color, i.e. one of: #nnn, #nnnnnn, rgb(), rgba(), hsl(), hsla()
canvasstringA CSS color that alpha based backgrounds blends into

Returns:

number

A contrast ratio value in the range 0 - 21.