Reverse lookup table?

[NateBaldwinDesign]

@Myndex this table is very helpful if you come to the problem with the question of "What font sizes and weights can I use for this foreground/background color pair?"

However, it's not very clear how an inverse of this would be resolved -- "What contrast value do I need to meet for text of font-weight X and font size Y on background color Z"? On top of that, I see there are also "Levels"/"Scores", so it would be nice to inject that variable into the same question -- "...and for score level 5".

Is that logic, or the table of requirements already somewhere in this codebase? The text version of the lookup table isn't much more helpful, since it doesn't specify score level ranges.

Here's an example use case for what I'm trying to accomplish: As a designer, I have already chosen a background color for my application (#f5f5f5) and a typography scale (14px, 16px, 18px, 22px ...). I also support font weights of 400, and 700. For each of these combinations, I would like to run a simple function such as:

function APCAContrastValue(fontSize, fontWeight, backgroundColor, scoreLevel) {
    // look up table?
   return contrastValue;
}

For example:

var desiredContrastValue = APCAContrastValue('14px', 400, 0xf5f5f5, 5);
// returns 100

[Myndex]

Hey Nate, to answer:

"What contrast value do I need to meet for text of font-weight X and font size Y on background color Z"?

That is shown on the manual lookup table lower on the page. The background color is irrelevant, in that any APCA contrast value is the same. Or perhaps I should say, the SAPC methodology predicts a perceived contrast relative to either the text or background color, so if a given font needs contrast 60, it does not matter if the BG if f5f5f5 or ccc — contrast 60 will mean a text color of 818181 or 4c4c4c respectively.

At https://www.myndex.com/SAPC/ go into research mode and select "constant contrast" for an interactive demo.

SAPCinverse

If you mean a tool that you can enter a BG color and a text size/weight, that is possible (and planned).

In the JS file at

https://www.myndex.com/SAPC/JS/DEV98G_SAPCsRGB.js

Is a function called SAPCinverse() that will return a color based on a BG color and a target contrast.

Also, the index file https://www.myndex.com/SAPC/ (and also /APCA/) includes lookup tables that are useful for interpolation.

The manual lookup table, lower on the page, indicates the contrast needed for a particular font size and weight, and I think that is what you are looking for?

As for scoring levels, there is an obsolete set of tables that were part of the discussion here: https://www.w3.org/WAI/GL/task-forces/silver/wiki/Talk:Visual_Contrast_of_Text_Subgroup

Note these are OBSOLETE relative to the current constants, they have not been updated as the way conformance and score levels is being handled is not clear at the moment.

For the time being, focus on "Score 4" and the current table displayed lower on the page at https://www.myndex.com/SAPC/

As this is all still a work in progress, some of these finer aspects are still being worked out.