Are My Colours Accessible API

Use the API to quickly return the colour contrast ratio of two colors and its rating.

URL:

Post data as the body of a request to:

https://www.aremycolorsaccessible.com/api/are-they

Params:

Set the body as a valid JSON string of an array of 2 colors.

{
  "colors": ["#fff", "#000"]
}

Return:

You'll be returned an object in the following shape:

{
  "Small": "AAA" | "AA" | "A" | "Fail",
  "Bold": "AAA" | "AA" | "A" | "Fail",
  "Large": "AAA" | "AA" | "A" | "Fail",
  "Overall": "Yup" | "Kinda" | "Nope",
  "Contrast": string,
}

Example:

Your implementation might look like this:

fetch('https://www.aremycolorsaccessible.com/api/are-they', {
  mode: 'cors',
  method: 'POST',
  body: JSON.stringify({ colors: ['#5c0700', '#e4ef65'] }),
})
  .then((response) => response.json())
  .then((json) => {
    doSomethingWithJSON(json)
  });

{}

Example CodeSandbox:

Just to give you a full playground to play with, here is a CodeSandbox we prepared earlier