WCAG colour checker

About five years ago I created a small PHP class that would check the contrast of a foreground and background colour and give a report on whether it was accessible in accordance with the WCAG recommendations (so either AA or AAA compliant).

I’ve recently had cause to dig out that script which gave me the opportunity to also create a version in javascript.

Usage is very simple… Say I have these two colours:

vivid red – rgb(207, 46, 46) – #cf2e2e

and

cyan blueish grey – rgb(171, 184, 195) – #abb8c3

If I used then in combination, with say the red being the background colour and the grey being the text colour, the PHP code would look something like:

var_dump(WCAG::accessibility('abb8c3', 'cf2e2e'));

The result of which would show the contrast ration and if it passes WCAG 2.0 for AA, AA with large fonts, AAA, and AAA with large fonts… No surprise really that the combination above would fail!

array(2) {
'ratio' => string(4) "2.54"
'2.0' => array(4) {
'aa' => bool(false)
'aa-18pt' => bool(false)
'aaa' => bool(false)
'aaa-18pt' => bool(false)
}
}

But try that with the red background and white text and we’d see a different result:

// var_dump(WCAG::accessibility('fff', [207, 46, 46]));

array(2) {
'ratio' => string(4) "5.14"
'2.0' => array(4) {
'aa' => bool(true)
'aa-18pt' => bool(true)
'aaa' => bool(false)
'aaa-18pt' => bool(true)
}
}

You can supply the colours in full or short hex format – with or without the # – or as a RGB array.

The javascript version is just as simple to use. So why not check out the repository with the code, fork is and contribute if you’d like – examples are included in the repo.

Did you like this? Share it:

First attempt at a kiridashi

A kiridashi is a small Japanese knife with a chisel grind and sharp point and it used as a utility knife, scoring or carving.

I had some really rusty angle iron kicking around still, so I thought I’d get in a little practice. Unfortunately I still have no forge, so couldn’t try to smith the shape so I went with stock removal – it was good practice on using the angle grinder and hand sanding the

Now, this probably isn’t great metal for making a knife – it’s certainly quite thing and probably doesn’t have enough carbon to hold an edge (and I’m not very adept yet at the ol’ spark test to really be able to tell), but I’m pretty happy with the result (even if it didn’t hold it’s edge for too long!)

Did you like this? Share it: