Change QR code colors

I almost posted this as a question to the community, but it seems clear from my online and in-Composer research that it simply isn’t possible right now: displaying automatically-generated QR codes in any colors other than black & white. As I assume almost everyone here knows, QR codes merely have to have enough contrast for the viewing device to discern the grid, otherwise the colors used are pretty irrelevant (they’re even embedding logos in some codes now). And that’s relevant to me, as a designer, because this:

…is a lot more elegant/appealing than this:

We’re getting ready to heavily implement QR codes in a bank of no-touch experiences for one of our clients, so having all of those appear as stark B&W blocks… ugh.

I’m kind of surprised it doesn’t already exist, but I realize that QR codes are still gaining adoption, even though the majority of smart phones now have it implemented at the OS level and at least a high percentage of users know how to use them. And perhaps more importantly, the world is currently rejecting touch displays, for obvious reasons, and this is a fairly low-bar method of maintaining a small degree of interactivity.

Developmentally, this should be pretty easy to implement, it would basically just show up in the form of foreground/background colors in the asset UI.

Thanks!

Hi @whit,

Our current embedded QR Code Generator indeed only generates black & white codes. It’s a good suggestion for a future improvement.

In the meantime, you can already dynamically generate a colored code using an online API such as QR code API: command “create-qr-code” (generate QR code, QR code generator)

For example, the URL below will generate a QR Code with your desired background color


image

You can directly put this URL in the “Image” property of an Image asset to display it in Composer

Or if you need this URL to be dynamically generated, you can

Let me know if that would address your needs.

Seb

3 Likes

Ah, I believe that will suffice, thanks Seb!

1 Like

A quick follow-up to report that this was a slam-dunk, super easy to implement, and the API even allows for a foreground color to be selected! Thanks again, Seb.

2 Likes