Michaël Vaes

Michaël Vaes https://echo.michaelvaes.be/ Software developer and do-it-yourselfer, trying to master the fine art of creating something awesome Fri, 10 Apr 2026 12:23:51 +0000 https://i.snap.as/zGjnBhHg.png Michaël Vaes https://echo.michaelvaes.be/ Garmin MIP color matrix https://echo.michaelvaes.be/garmin-mip-color-matrix?pk_campaign=rss-feed <![CDATA[Many Garmin products, like my Enduro 3, use a screen technology known as Memory-in-Pixel (MIP). MIP displays are very low power. For my watch face, I wanted to choose a bright green colour, so I researched the supported options. Now let’s transform them into something visual. For now, I have chosen the brightest green possible: #00FF00. div id="grid" aria-label="8 by 8 color matrix" style="display: grid; grid-template-columns: repeat(8, minmax(72px, 1fr)); gap: 10px; align-items: start;"div style="display: grid; grid-template-rows: 72px auto; gap: 6px;"div style="width: 100%; height: 72px; border-radius: 6px; border: 1px solid rgba(0, 0, 0, 0.15); box-shadow: rgba(255, 255, 255, 0.15) 0px 0px 0px 1px inset; background-color: rgb(255, 255, 255);" title="0xFFFFFF = #FFFFFF"/divdiv style="font: 12px/1.2 ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace; text-align: center; color: #333;"#FFFFFF/div/divdiv style="display: grid; grid-template-rows: 72px auto; gap: 6px;"div style="width: 100%; height: 72px; border-radius: 6px; border: 1px solid rgba(0, 0, 0, 0.15); box-shadow: rgba(255, 255, 255, 0.15) 0px 0px 0px 1px inset; background-color: rgb(255, 255, 170);" title="0xFFFFAA = #FFFFAA"/divdiv style="font: 12px/1.2 ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace; text-align: center; color: #333;"#FFFFAA/div/divdiv style="display: grid; grid-template-rows: 72px auto; gap: 6px;"div style="width: 100%; height: 72px; border-radius: 6px; border: 1px solid rgba(0, 0, 0, 0.15); box-shadow: rgba(255, 255, 255, 0.15) 0px 0px 0px 1px inset; background-color: rgb(255, 255, 85);" title="0xFFFF55 = #FFFF55"/divdiv style="font: 12px/1.2 ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace; text-align: center; color: #333;"#FFFF55/div/divdiv style="display: grid; grid-template-rows: 72px auto; gap: 6px;"div style="width: 100%; height: 72px; border-radius: 6px; border: 1px solid rgba(0, 0, 0, 0.15); box-shadow: rgba(255, 255, 255, 0.15) 0px 0px 0px 1px inset; background-color: rgb(255, 255, 0);" title="0xFFFF00 = #FFFF00"/divdiv style="font: 12px/1.2 ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace; text-align: center; color: #333;"#FFFF00/div/divdiv style="display: grid; grid-template-rows: 72px auto; gap: 6px;"div style="width: 100%; height: 72px; border-radius: 6px; border: 1px solid rgba(0, 0, 0, 0.15); box-shadow: rgba(255, 255, 255, 0.15) 0px 0px 0px 1px inset; background-color: rgb(255, 170, 255);" title="0xFFAAFF = #FFAAFF"/divdiv style="font: 12px/1.2 ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace; text-align: center; color: #333;"#FFAAFF/div/divdiv style="display: grid; grid-template-rows: 72px auto; gap: 6px;"div style="width: 100%; height: 72px; border-radius: 6px; border: 1px solid rgba(0, 0, 0, 0.15); box-shadow: rgba(255, 255, 255, 0.15) 0px 0px 0px 1px inset; background-color: rgb(255, 170, 170);" title="0xFFAAAA = #FFAAAA"/divdiv style="font: 12px/1.2 ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace; text-align: center; color: #333;"#FFAAAA/div/divdiv style="display: grid; grid-template-rows: 72px auto; gap: 6px;"div style="width: 100%; height: 72px; border-radius: 6px; border: 1px solid rgba(0, 0, 0, 0.15); box-shadow: rgba(255, 255, 255, 0.15) 0px 0px 0px 1px inset; background-color: rgb(255, 170, 85);" title="0xFFAA55 = #FFAA55"/divdiv style="font: 12px/1.2 ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace; text-align: center; color: #333;"#FFAA55/div/divdiv style="display: grid; grid-template-rows: 72px auto; gap: 6px;"div style="width: 100%; height: 72px; border-radius: 6px; border: 1px solid rgba(0, 0, 0, 0.15); box-shadow: rgba(255, 255, 255, 0.15) 0px 0px 0px 1px inset; background-color: rgb(255, 170, 0);" title="0xFFAA00 = #FFAA00"/divdiv style="font: 12px/1.2 ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace; text-align: center; color: #333;"#FFAA00/div/divhr style="grid-column: 1 / -1; height: 0; border: none; border-top: 1px dashed #ddd; margin: 6px 0;"div style="display: grid; grid-template-rows: 72px auto; gap: 6px;"div style="width: 100%; height: 72px; border-radius: 6px; border: 1px solid rgba(0, 0, 0, 0.15); box-shadow: rgba(255, 255, 255, 0.15) 0px 0px 0px 1px inset; background-color: rgb(255, 85, 255);" title="0xFF55FF = #FF55FF"/divdiv style="font: 12px/1.2 ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace; text-align: center; color: #333;"#FF55FF/div/divdiv style="display: grid; grid-template-rows: 72px auto; gap: 6px;"div style="width: 100%; height: 72px; border-radius: 6px; border: 1px solid rgba(0, 0, 0, 0.15); box-shadow: rgba(255, 255, 255, 0.15) 0px 0px 0px 1px inset; background-color: rgb(255, 85, 170);" title="0xFF55AA = #FF55AA"/divdiv style="font: 12px/1.2 ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace; text-align: center; color: #333;"#FF55AA/div/divdiv style="display: grid; grid-template-rows: 72px auto; gap: 6px;"div style="width: 100%; height: 72px; border-radius: 6px; border: 1px solid rgba(0, 0, 0, 0.15); box-shadow: rgba(255, 255, 255, 0.15) 0px 0px 0px 1px inset; background-color: rgb(255, 85, 85);" title="0xFF5555 = #FF5555"/divdiv style="font: 12px/1.2 ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace; text-align: center; color: #333;"#FF5555/div/divdiv style="display: grid; grid-template-rows: 72px auto; gap: 6px;"div style="width: 100%; height: 72px; border-radius: 6px; border: 1px solid rgba(0, 0, 0, 0.15); box-shadow: rgba(255, 255, 255, 0.15) 0px 0px 0px 1px inset; background-color: rgb(255, 85, 0);" title="0xFF5500 = #FF5500"/divdiv style="font: 12px/1.2 ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace; text-align: center; color: #333;"#FF5500/div/divdiv style="display: grid; grid-template-rows: 72px auto; gap: 6px;"div style="width: 100%; height: 72px; border-radius: 6px; border: 1px solid rgba(0, 0, 0, 0.15); box-shadow: rgba(255, 255, 255, 0.15) 0px 0px 0px 1px inset; background-color: rgb(255, 0, 255);" title="0xFF00FF = #FF00FF"/divdiv style="font: 12px/1.2 ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace; text-align: center; color: #333;"#FF00FF/div/divdiv style="display: grid; grid-template-rows: 72px auto; gap: 6px;"div style="width: 100%; height: 72px; border-radius: 6px; border: 1px solid rgba(0, 0, 0, 0.15); box-shadow: rgba(255, 255, 255, 0.15) 0px 0px 0px 1px inset; background-color: rgb(255, 0, 170);" title="0xFF00AA = #FF00AA"/divdiv style="font: 12px/1.2 ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace; text-align: center; color: #333;"#FF00AA/div/divdiv style="display: grid; grid-template-rows: 72px auto; gap: 6px;"div style="width: 100%; height: 72px; border-radius: 6px; border: 1px solid rgba(0, 0, 0, 0.15); box-shadow: rgba(255, 255, 255, 0.15) 0px 0px 0px 1px inset; background-color: rgb(255, 0, 85);" title="0xFF0055 = #FF0055"/divdiv style="font: 12px/1.2 ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace; text-align: center; color: #333;"#FF0055/div/divdiv style="display: grid; grid-template-rows: 72px auto; gap: 6px;"div style="width: 100%; height: 72px; border-radius: 6px; border: 1px solid rgba(0, 0, 0, 0.15); box-shadow: rgba(255, 255, 255, 0.15) 0px 0px 0px 1px inset; background-color: rgb(255, 0, 0);" title="0xFF0000 = #FF0000"/divdiv style="font: 12px/1.2 ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace; text-align: center; color: #333;"#FF0000/div/divhr style="grid-column: 1 / -1; height: 0; border: none; border-top: 1px dashed #ddd; margin: 6px 0;"div style="display: grid; grid-template-rows: 72px auto; gap: 6px;"div style="width: 100%; height: 72px; border-radius: 6px; border: 1px solid rgba(0, 0, 0, 0.15); box-shadow: rgba(255, 255, 255, 0.15) 0px 0px 0px 1px inset; background-color: rgb(170, 255, 255);" title="0xAAFFFF = #AAFFFF"/divdiv style="font: 12px/1.2 ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace; text-align: center; color: #333;"#AAFFFF/div/divdiv style="display: grid; grid-template-rows: 72px auto; gap: 6px;"div style="width: 100%; height: 72px; border-radius: 6px; border: 1px solid rgba(0, 0, 0, 0.15); box-shadow: rgba(255, 255, 255, 0.15) 0px 0px 0px 1px inset; background-color: rgb(170, 255, 170);" title="0xAAFFAA = #AAFFAA"/divdiv style="font: 12px/1.2 ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace; text-align: center; color: #333;"#AAFFAA/div/divdiv style="display: grid; grid-template-rows: 72px auto; gap: 6px;"div style="width: 100%; height: 72px; border-radius: 6px; border: 1px solid rgba(0, 0, 0, 0.15); box-shadow: rgba(255, 255, 255, 0.15) 0px 0px 0px 1px inset; background-color: rgb(170, 255, 85);" title="0xAAFF55 = #AAFF55"/divdiv style="font: 12px/1.2 ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace; text-align: center; color: #333;"#AAFF55/div/divdiv style="display: grid; grid-template-rows: 72px auto; gap: 6px;"div style="width: 100%; height: 72px; border-radius: 6px; border: 1px solid rgba(0, 0, 0, 0.15); box-shadow: rgba(255, 255, 255, 0.15) 0px 0px 0px 1px inset; background-color: rgb(170, 255, 0);" title="0xAAFF00 = #AAFF00"/divdiv style="font: 12px/1.2 ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace; text-align: center; color: #333;"#AAFF00/div/divdiv style="display: grid; grid-template-rows: 72px auto; gap: 6px;"div style="width: 100%; height: 72px; border-radius: 6px; border: 1px solid rgba(0, 0, 0, 0.15); box-shadow: rgba(255, 255, 255, 0.15) 0px 0px 0px 1px inset; background-color: rgb(170, 170, 255);" title="0xAAAAFF = #AAAAFF"/divdiv style="font: 12px/1.2 ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace; text-align: center; color: #333;"#AAAAFF/div/divdiv style="display: grid; grid-template-rows: 72px auto; gap: 6px;"div style="width: 100%; height: 72px; border-radius: 6px; border: 1px solid rgba(0, 0, 0, 0.15); box-shadow: rgba(255, 255, 255, 0.15) 0px 0px 0px 1px inset; background-color: rgb(170, 170, 170);" title="0xAAAAAA = #AAAAAA"/divdiv style="font: 12px/1.2 ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace; text-align: center; color: #333;"#AAAAAA/div/divdiv style="display: grid; grid-template-rows: 72px auto; gap: 6px;"div style="width: 100%; height: 72px; border-radius: 6px; border: 1px solid rgba(0, 0, 0, 0.15); box-shadow: rgba(255, 255, 255, 0.15) 0px 0px 0px 1px inset; background-color: rgb(170, 170, 85);" title="0xAAAA55 = #AAAA55"/divdiv style="font: 12px/1.2 ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace; text-align: center; color: #333;"#AAAA55/div/divdiv style="display: grid; grid-template-rows: 72px auto; gap: 6px;"div style="width: 100%; height: 72px; border-radius: 6px; border: 1px solid rgba(0, 0, 0, 0.15); box-shadow: rgba(255, 255, 255, 0.15) 0px 0px 0px 1px inset; background-color: rgb(170, 170, 0);" title="0xAAAA00 = #AAAA00"/divdiv style="font: 12px/1.2 ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace; text-align: center; color: #333;"#AAAA00/div/divhr style="grid-column: 1 / -1; height: 0; border: none; border-top: 1px dashed #ddd; margin: 6px 0;"div style="display: grid; grid-template-rows: 72px auto; gap: 6px;"div style="width: 100%; height: 72px; border-radius: 6px; border: 1px solid rgba(0, 0, 0, 0.15); box-shadow: rgba(255, 255, 255, 0.15) 0px 0px 0px 1px inset; background-color: rgb(170, 85, 255);" title="0xAA55FF = #AA55FF"/divdiv style="font: 12px/1.2 ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace; text-align: center; color: #333;"#AA55FF/div/divdiv style="display: grid; grid-template-rows: 72px auto; gap: 6px;"div style="width: 100%; height: 72px; border-radius: 6px; border: 1px solid rgba(0, 0, 0, 0.15); box-shadow: rgba(255, 255, 255, 0.15) 0px 0px 0px 1px inset; background-color: rgb(170, 85, 170);" title="0xAA55AA = #AA55AA"/divdiv style="font: 12px/1.2 ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace; text-align: center; color: #333;"#AA55AA/div/divdiv style="display: grid; grid-template-rows: 72px auto; gap: 6px;"div style="width: 100%; height: 72px; border-radius: 6px; border: 1px solid rgba(0, 0, 0, 0.15); box-shadow: rgba(255, 255, 255, 0.15) 0px 0px 0px 1px inset; background-color: rgb(170, 85, 85);" title="0xAA5555 = #AA5555"/divdiv style="font: 12px/1.2 ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace; text-align: center; color: #333;"#AA5555/div/divdiv style="display: grid; grid-template-rows: 72px auto; gap: 6px;"div style="width: 100%; height: 72px; border-radius: 6px; border: 1px solid rgba(0, 0, 0, 0.15); box-shadow: rgba(255, 255, 255, 0.15) 0px 0px 0px 1px inset; background-color: rgb(170, 85, 0);" title="0xAA5500 = #AA5500"/divdiv style="font: 12px/1.2 ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace; text-align: center; color: #333;"#AA5500/div/divdiv style="display: grid; grid-template-rows: 72px auto; gap: 6px;"div style="width: 100%; height: 72px; border-radius: 6px; border: 1px solid rgba(0, 0, 0, 0.15); box-shadow: rgba(255, 255, 255, 0.15) 0px 0px 0px 1px inset; background-color: rgb(170, 0, 255);" title="0xAA00FF = #AA00FF"/divdiv style="font: 12px/1.2 ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace; text-align: center; color: #333;"#AA00FF/div/divdiv style="display: grid; grid-template-rows: 72px auto; gap: 6px;"div style="width: 100%; height: 72px; border-radius: 6px; border: 1px solid rgba(0, 0, 0, 0.15); box-shadow: rgba(255, 255, 255, 0.15) 0px 0px 0px 1px inset; background-color: rgb(170, 0, 170);" title="0xAA00AA = #AA00AA"/divdiv style="font: 12px/1.2 ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace; text-align: center; color: #333;"#AA00AA/div/divdiv style="display: grid; grid-template-rows: 72px auto; gap: 6px;"div style="width: 100%; height: 72px; border-radius: 6px; border: 1px solid rgba(0, 0, 0, 0.15); box-shadow: rgba(255, 255, 255, 0.15) 0px 0px 0px 1px inset; background-color: rgb(170, 0, 85);" title="0xAA0055 = #AA0055"/divdiv style="font: 12px/1.2 ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace; text-align: center; color: #333;"#AA0055/div/divdiv style="display: grid; grid-template-rows: 72px auto; gap: 6px;"div style="width: 100%; height: 72px; border-radius: 6px; border: 1px solid rgba(0, 0, 0, 0.15); box-shadow: rgba(255, 255, 255, 0.15) 0px 0px 0px 1px inset; background-color: rgb(170, 0, 0);" title="0xAA0000 = #AA0000"/divdiv style="font: 12px/1.2 ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace; text-align: center; color: #333;"#AA0000/div/divhr style="grid-column: 1 / -1; height: 0; border: none; border-top: 1px dashed #ddd; margin: 6px 0;"div style="display: grid; grid-template-rows: 72px auto; gap: 6px;"div style="width: 100%; height: 72px; border-radius: 6px; border: 1px solid rgba(0, 0, 0, 0.15); box-shadow: rgba(255, 255, 255, 0.15) 0px 0px 0px 1px inset; background-color: rgb(85, 255, 255);" title="0x55FFFF = #55FFFF"/divdiv style="font: 12px/1.2 ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace; text-align: center; color: #333;"#55FFFF/div/divdiv style="display: grid; grid-template-rows: 72px auto; gap: 6px;"div style="width: 100%; height: 72px; border-radius: 6px; border: 1px solid rgba(0, 0, 0, 0.15); box-shadow: rgba(255, 255, 255, 0.15) 0px 0px 0px 1px inset; background-color: rgb(85, 255, 170);" title="0x55FFAA = #55FFAA"/divdiv style="font: 12px/1.2 ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace; text-align: center; color: #333;"#55FFAA/div/divdiv style="display: grid; grid-template-rows: 72px auto; gap: 6px;"div style="width: 100%; height: 72px; border-radius: 6px; border: 1px solid rgba(0, 0, 0, 0.15); box-shadow: rgba(255, 255, 255, 0.15) 0px 0px 0px 1px inset; background-color: rgb(85, 255, 85);" title="0x55FF55 = #55FF55"/divdiv style="font: 12px/1.2 ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace; text-align: center; color: #333;"#55FF55/div/divdiv style="display: grid; grid-template-rows: 72px auto; gap: 6px;"div style="width: 100%; height: 72px; border-radius: 6px; border: 1px solid rgba(0, 0, 0, 0.15); box-shadow: rgba(255, 255, 255, 0.15) 0px 0px 0px 1px inset; background-color: rgb(85, 255, 0);" title="0x55FF00 = #55FF00"/divdiv style="font: 12px/1.2 ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace; text-align: center; color: #333;"#55FF00/div/divdiv style="display: grid; grid-template-rows: 72px auto; gap: 6px;"div style="width: 100%; height: 72px; border-radius: 6px; border: 1px solid rgba(0, 0, 0, 0.15); box-shadow: rgba(255, 255, 255, 0.15) 0px 0px 0px 1px inset; background-color: rgb(85, 170, 255);" title="0x55AAFF = #55AAFF"/divdiv style="font: 12px/1.2 ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace; text-align: center; color: #333;"#55AAFF/div/divdiv style="display: grid; grid-template-rows: 72px auto; gap: 6px;"div style="width: 100%; height: 72px; border-radius: 6px; border: 1px solid rgba(0, 0, 0, 0.15); box-shadow: rgba(255, 255, 255, 0.15) 0px 0px 0px 1px inset; background-color: rgb(85, 170, 170);" title="0x55AAAA = #55AAAA"/divdiv style="font: 12px/1.2 ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace; text-align: center; color: #333;"#55AAAA/div/divdiv style="display: grid; grid-template-rows: 72px auto; gap: 6px;"div style="width: 100%; height: 72px; border-radius: 6px; border: 1px solid rgba(0, 0, 0, 0.15); box-shadow: rgba(255, 255, 255, 0.15) 0px 0px 0px 1px inset; background-color: rgb(85, 170, 85);" title="0x55AA55 = #55AA55"/divdiv style="font: 12px/1.2 ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace; text-align: center; color: #333;"#55AA55/div/divdiv style="display: grid; grid-template-rows: 72px auto; gap: 6px;"div style="width: 100%; height: 72px; border-radius: 6px; border: 1px solid rgba(0, 0, 0, 0.15); box-shadow: rgba(255, 255, 255, 0.15) 0px 0px 0px 1px inset; background-color: rgb(85, 170, 0);" title="0x55AA00 = #55AA00"/divdiv style="font: 12px/1.2 ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace; text-align: center; color: #333;"#55AA00/div/divhr style="grid-column: 1 / -1; height: 0; border: none; border-top: 1px dashed #ddd; margin: 6px 0;"div style="display: grid; grid-template-rows: 72px auto; gap: 6px;"div style="width: 100%; height: 72px; border-radius: 6px; border: 1px solid rgba(0, 0, 0, 0.15); box-shadow: rgba(255, 255, 255, 0.15) 0px 0px 0px 1px inset; background-color: rgb(85, 85, 255);" title="0x5555FF = #5555FF"/divdiv style="font: 12px/1.2 ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace; text-align: center; color: #333;"#5555FF/div/divdiv style="display: grid; grid-template-rows: 72px auto; gap: 6px;"div style="width: 100%; height: 72px; border-radius: 6px; border: 1px solid rgba(0, 0, 0, 0.15); box-shadow: rgba(255, 255, 255, 0.15) 0px 0px 0px 1px inset; background-color: rgb(85, 85, 170);" title="0x5555AA = #5555AA"/divdiv style="font: 12px/1.2 ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace; text-align: center; color: #333;"#5555AA/div/divdiv style="display: grid; grid-template-rows: 72px auto; gap: 6px;"div style="width: 100%; height: 72px; border-radius: 6px; border: 1px solid rgba(0, 0, 0, 0.15); box-shadow: rgba(255, 255, 255, 0.15) 0px 0px 0px 1px inset; background-color: rgb(85, 85, 85);" title="0x555555 = #555555"/divdiv style="font: 12px/1.2 ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace; text-align: center; color: #333;"#555555/div/divdiv style="display: grid; grid-template-rows: 72px auto; gap: 6px;"div style="width: 100%; height: 72px; border-radius: 6px; border: 1px solid rgba(0, 0, 0, 0.15); box-shadow: rgba(255, 255, 255, 0.15) 0px 0px 0px 1px inset; background-color: rgb(85, 85, 0);" title="0x555500 = #555500"/divdiv style="font: 12px/1.2 ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace; text-align: center; color: #333;"#555500/div/divdiv style="display: grid; grid-template-rows: 72px auto; gap: 6px;"div style="width: 100%; height: 72px; border-radius: 6px; border: 1px solid rgba(0, 0, 0, 0.15); box-shadow: rgba(255, 255, 255, 0.15) 0px 0px 0px 1px inset; background-color: rgb(85, 0, 255);" title="0x5500FF = #5500FF"/divdiv style="font: 12px/1.2 ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace; text-align: center; color: #333;"#5500FF/div/divdiv style="display: grid; grid-template-rows: 72px auto; gap: 6px;"div style="width: 100%; height: 72px; border-radius: 6px; border: 1px solid rgba(0, 0, 0, 0.15); box-shadow: rgba(255, 255, 255, 0.15) 0px 0px 0px 1px inset; background-color: rgb(85, 0, 170);" title="0x5500AA = #5500AA"/divdiv style="font: 12px/1.2 ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace; text-align: center; color: #333;"#5500AA/div/divdiv style="display: grid; grid-template-rows: 72px auto; gap: 6px;"div style="width: 100%; height: 72px; border-radius: 6px; border: 1px solid rgba(0, 0, 0, 0.15); box-shadow: rgba(255, 255, 255, 0.15) 0px 0px 0px 1px inset; background-color: rgb(85, 0, 85);" title="0x550055 = #550055"/divdiv style="font: 12px/1.2 ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace; text-align: center; color: #333;"#550055/div/divdiv style="display: grid; grid-template-rows: 72px auto; gap: 6px;"div style="width: 100%; height: 72px; border-radius: 6px; border: 1px solid rgba(0, 0, 0, 0.15); box-shadow: rgba(255, 255, 255, 0.15) 0px 0px 0px 1px inset; background-color: rgb(85, 0, 0);" title="0x550000 = #550000"/divdiv style="font: 12px/1.2 ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace; text-align: center; color: #333;"#550000/div/divhr style="grid-column: 1 / -1; height: 0; border: none; border-top: 1px dashed #ddd; margin: 6px 0;"div style="display: grid; grid-template-rows: 72px auto; gap: 6px;"div style="width: 100%; height: 72px; border-radius: 6px; border: 1px solid rgba(0, 0, 0, 0.15); box-shadow: rgba(255, 255, 255, 0.15) 0px 0px 0px 1px inset; background-color: rgb(0, 255, 255);" title="0x00FFFF = #00FFFF"/divdiv style="font: 12px/1.2 ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace; text-align: center; color: #333;"#00FFFF/div/divdiv style="display: grid; grid-template-rows: 72px auto; gap: 6px;"div style="width: 100%; height: 72px; border-radius: 6px; border: 1px solid rgba(0, 0, 0, 0.15); box-shadow: rgba(255, 255, 255, 0.15) 0px 0px 0px 1px inset; background-color: rgb(0, 255, 170);" title="0x00FFAA = #00FFAA"/divdiv style="font: 12px/1.2 ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace; text-align: center; color: #333;"#00FFAA/div/divdiv style="display: grid; grid-template-rows: 72px auto; gap: 6px;"div style="width: 100%; height: 72px; border-radius: 6px; border: 1px solid rgba(0, 0, 0, 0.15); box-shadow: rgba(255, 255, 255, 0.15) 0px 0px 0px 1px inset; background-color: rgb(0, 255, 85);" title="0x00FF55 = #00FF55"/divdiv style="font: 12px/1.2 ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace; text-align: center; color: #333;"#00FF55/div/divdiv style="display: grid; grid-template-rows: 72px auto; gap: 6px;"div style="width: 100%; height: 72px; border-radius: 6px; border: 1px solid rgba(0, 0, 0, 0.15); box-shadow: rgba(255, 255, 255, 0.15) 0px 0px 0px 1px inset; background-color: rgb(0, 255, 0);" title="0x00FF00 = #00FF00"/divdiv style="font: 12px/1.2 ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace; text-align: center; color: #333;"#00FF00/div/divdiv style="display: grid; grid-template-rows: 72px auto; gap: 6px;"div style="width: 100%; height: 72px; border-radius: 6px; border: 1px solid rgba(0, 0, 0, 0.15); box-shadow: rgba(255, 255, 255, 0.15) 0px 0px 0px 1px inset; background-color: rgb(0, 170, 255);" title="0x00AAFF = #00AAFF"/divdiv style="font: 12px/1.2 ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace; text-align: center; color: #333;"#00AAFF/div/divdiv style="display: grid; grid-template-rows: 72px auto; gap: 6px;"div style="width: 100%; height: 72px; border-radius: 6px; border: 1px solid rgba(0, 0, 0, 0.15); box-shadow: rgba(255, 255, 255, 0.15) 0px 0px 0px 1px inset; background-color: rgb(0, 170, 170);" title="0x00AAAA = #00AAAA"/divdiv style="font: 12px/1.2 ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace; text-align: center; color: #333;"#00AAAA/div/divdiv style="display: grid; grid-template-rows: 72px auto; gap: 6px;"div style="width: 100%; height: 72px; border-radius: 6px; border: 1px solid rgba(0, 0, 0, 0.15); box-shadow: rgba(255, 255, 255, 0.15) 0px 0px 0px 1px inset; background-color: rgb(0, 170, 85);" title="0x00AA55 = #00AA55"/divdiv style="font: 12px/1.2 ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace; text-align: center; color: #333;"#00AA55/div/divdiv style="display: grid; grid-template-rows: 72px auto; gap: 6px;"div style="width: 100%; height: 72px; border-radius: 6px; border: 1px solid rgba(0, 0, 0, 0.15); box-shadow: rgba(255, 255, 255, 0.15) 0px 0px 0px 1px inset; background-color: rgb(0, 170, 0);" title="0x00AA00 = #00AA00"/divdiv style="font: 12px/1.2 ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace; text-align: center; color: #333;"#00AA00/div/divhr style="grid-column: 1 / -1; height: 0; border: none; border-top: 1px dashed #ddd; margin: 6px 0;"div style="display: grid; grid-template-rows: 72px auto; gap: 6px;"div style="width: 100%; height: 72px; border-radius: 6px; border: 1px solid rgba(0, 0, 0, 0.15); box-shadow: rgba(255, 255, 255, 0.15) 0px 0px 0px 1px inset; background-color: rgb(0, 85, 255);" title="0x0055FF = #0055FF"/divdiv style="font: 12px/1.2 ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace; text-align: center; color: #333;"#0055FF/div/divdiv style="display: grid; grid-template-rows: 72px auto; gap: 6px;"div style="width: 100%; height: 72px; border-radius: 6px; border: 1px solid rgba(0, 0, 0, 0.15); box-shadow: rgba(255, 255, 255, 0.15) 0px 0px 0px 1px inset; background-color: rgb(0, 85, 170);" title="0x0055AA = #0055AA"/divdiv style="font: 12px/1.2 ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace; text-align: center; color: #333;"#0055AA/div/divdiv style="display: grid; grid-template-rows: 72px auto; gap: 6px;"div style="width: 100%; height: 72px; border-radius: 6px; border: 1px solid rgba(0, 0, 0, 0.15); box-shadow: rgba(255, 255, 255, 0.15) 0px 0px 0px 1px inset; background-color: rgb(0, 85, 85);" title="0x005555 = #005555"/divdiv style="font: 12px/1.2 ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace; text-align: center; color: #333;"#005555/div/divdiv style="display: grid; grid-template-rows: 72px auto; gap: 6px;"div style="width: 100%; height: 72px; border-radius: 6px; border: 1px solid rgba(0, 0, 0, 0.15); box-shadow: rgba(255, 255, 255, 0.15) 0px 0px 0px 1px inset; background-color: rgb(0, 85, 0);" title="0x005500 = #005500"/divdiv style="font: 12px/1.2 ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace; text-align: center; color: #333;"#005500/div/divdiv style="display: grid; grid-template-rows: 72px auto; gap: 6px;"div style="width: 100%; height: 72px; border-radius: 6px; border: 1px solid rgba(0, 0, 0, 0.15); box-shadow: rgba(255, 255, 255, 0.15) 0px 0px 0px 1px inset; background-color: rgb(0, 0, 255);" title="0x0000FF = #0000FF"/divdiv style="font: 12px/1.2 ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace; text-align: center; color: #333;"#0000FF/div/divdiv style="display: grid; grid-template-rows: 72px auto; gap: 6px;"div style="width: 100%; height: 72px; border-radius: 6px; border: 1px solid rgba(0, 0, 0, 0.15); box-shadow: rgba(255, 255, 255, 0.15) 0px 0px 0px 1px inset; background-color: rgb(0, 0, 170);" title="0x0000AA = #0000AA"/divdiv style="font: 12px/1.2 ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace; text-align: center; color: #333;"#0000AA/div/divdiv style="display: grid; grid-template-rows: 72px auto; gap: 6px;"div style="width: 100%; height: 72px; border-radius: 6px; border: 1px solid rgba(0, 0, 0, 0.1