JSFiddle - React, Tailwind, and code Playground
HTML
<pre>
<script>
p='00 00 00 00 c2 04 d5 07 55 0e 77 0f 5d 04 e4 0f 5f 05 7f 07 cd 05 ce 08 b2 03 5c 0b cc 0c ff 0f'.split(/ +/).join(',').replace(/(.)(.),0(.)/g,'$2$1$3').split(',');
q='000 000 0a5 5f5 00f 55f a55 5ff f55 faa ff5 fa5 0a0 f5a aaa fff'.split(' ');
q2='000 000 0a5 5f5 55f aaf a00 5ff f55 faa aa5 ff5 050 f5a aaa fff'.split(' ');
d=p=>p.map(c=>`<span style="background:#${c};color:${(parseInt(c,16)&0x888)?'black':'white'}">${((parseInt(c,16)&0xccc)==((parseInt(c,16)&0x333)<<2)&&parseInt(c,16)<=0xfff)?((0x100+parseInt(c.replace(/f/g,'11').replace(/0/g,'00').replace(/5/g,'01').replace(/a/g,'10').replace(/(..)(..)(..)/,'$3$2$1'),2)).toString(16).substr(1)):'--'}:${c}</span>`);
document.write(d(p));
document.write('<br>');
document.write(d(q));
document.write('<br>');
document.write(d(q2));
document.write('<br>');
_nib=n=>Math.max(Math.min(Math.log(n+1)/Math.log(16)*15-2,15),0)&0xc;
nib=n=>(_nib(n&0xf)|(_nib((n&0xf0)>>4)<<4)|(_nib((n&0xf00)>>8)<<8))&0xccc;
nib2=n=>nib(n)|(nib(n)>>2);
document.write(d(p.map(c=>((nib2(Number('0x'+c)))+0x1000).toString(16).substr(1))));
document.write('<br>');
_lnib=n=>parseInt(('00055555aaaaafff')[n],16)&0xc;
lnib=n=>(_lnib(n&0xf)|(_lnib((n&0xf0)>>4)<<4)|(_lnib((n&0xf00)>>8)<<8))&0xccc;
lnib2=n=>lnib(n)|(lnib(n)>>2);
document.write(d(p.map(c=>((lnib2(Number('0x'+c)))+0x1000).toString(16).substr(1))));
document.write('<br>');
_llnib=n=>parseInt(('00005555aaaaffff')[n],16)&0xc;
llnib=n=>(_llnib(n&0xf)|(_llnib((n&0xf0)>>4)<<4)|(_llnib((n&0xf00)>>8)<<8))&0xccc;
llnib2=n=>llnib(n)|(llnib(n)>>2);
document.write(d(p.map(c=>((llnib2(Number('0x'+c)))+0x1000).toString(16).substr(1))));
document.write('<br>');
_qlnib=n=>parseInt(('0000005555afaaff')[n],16)&0xc;
qlnib=n=>(_qlnib(n&0xf)|(_qlnib((n&0xf0)>>4)<<4)|(_qlnib((n&0xf00)>>8)<<8))&0xccc;
qlnib2=n=>qlnib(n)|(qlnib(n)>>2);
document.write(d(p.map(c=>((qlnib2(Number('0x'+c)))+0x1000).toString(16).substr(1))));
</script>