Skip to content

Color Extraction

We've reimplemented color indexing using a 3x3 thumbnail. It enables us to search specific parts of an image. Our previous algorithm was not deterministic, so search would have returned different results every time.

Demo: https://demo.photoprism.org/photos?q=green

Colors

See https://vuetifyjs.com/en/framework/colors

TODO: Complete table with ID, Color Name, HTML Code and Sample

ID Name Code Sample
0 Black #000000
1 Brown #795548
2 Grey #9E9E9E
3 White #FFFFFF
4 Purple #9C27B0
5 Gold #FFDF00
6 Blue #3F51B5
7 Cyan #00BCD4
8 Teal #009688
9 Green #4CAF50
A Lime #CDDC39
B Yellow #FFEB3B
C Magenta #FF00FF
D Orange #FF9800
E Red #F44336
F Pink #E91E63
ID Name Code Sample
0 Black #000000
1 Brown #A1887F #8D6E63 #A07F6C #9B7B5B #75645B #795548 #6D4C41 #5D4037 #9B6136 #C1A487 #AA8062 #6B5546 #B4B59C #B2B49B
2 Grey #E0E0E0 #9E9E9E #757575 #616161 #424242 #847A72 #DFE0E1
3 White #FFFFFF #E4E4E4 #E7E7E7
4 Purple #F3E5F5 #E1BEE7 #CE93D8 #BA68C8 #AB47BC #9C27B0 #9B318F #86007E #8E24AA #7B1FA2 #6A1B9A #4A148C #AA00FF #EDE7F6 #D1C4E9 #B39DDB #9575CD #7E57C2 #5E35B1 #673AB7 #512DA8 #4527A0 #311B92 #B388FF #7C4DFF #8E6493 #5E3A5E #440E79 #483678 #4E3880 #3B0E79
5 Gold #EDDEAC #E8B451 #C08A3E #A27D4b #755531 #D19327 #DEA253 #D5AA6F #F5EAD4
6 Blue #3F51B5 #C5CAE9 #5C6BC0 #3949AB #303F9F #283593 #1A237E #536DFE #3D5AFE #304FFE #2196F3 #BBDEFB #90CAF9 #64B5F6 #42A5F5 #1E88E5 #1976D2 #1565C0 #0D47A1 #82B1FF #448AFF #2979FF #2962FF #03A9F6 #B3E5FC #81D4FA #4FC3F7 #29B6F6 #039BE5 #0288D1 #0277BD #01579B #80D8FF #40C4FF #00B0FF #0091EA #607D8B #78909C #546E7A #37474F #E4EBFD #7DD3EA #076399 #28446B #4AC8F5 #0800F4 #012D5F
7 Cyan #B2EBF2 #80DEEA #4DD0E1 #26C6DA #00B8D4 #00BCD4 #00ACC1 #0097A7 #00838F #006064 #84FFFF #18FFFF #00E5FF
8 Teal #009688 #00897B #00796B #00695C #045D5C #245A5F #03454F #2C545E #174741
9 Green #E8F5E9 #C8E6C9 #ABC7B0 #A5D6A7 #81C784 #66BB6A #4CAF50 #43A047 #388E3C #2E7D32 #1B5E20 #F1F8E9 #DCEDC8 #C5E1A5 #AED581 #8BC34A #9CCC65 #7CB342 #689F38 #558B2F #33691E #B9F6CA #69F0AE #00C853 #00E676 #CCFF90 #B2FF59 #76FF03 #64DD17 #DDD579 #EEECA2 #244E3B #9A9D47 #BEBD76 #5C5A30 #B3C16C #ACA783 #474C25 #CDD087 #796D41
A Lime #F0F4C3 #E6EE9C #DCE775 #D4E157 #CDDC39 #C0CA33 #AFB42B #EEFF41 #C6FF00 #AEEA00
B Yellow #FFF9C4 #FFF59D #FFF176 #FFEE58 #FFFF8D #FFFF00 #FFD54F #FFCA28 #E3CE81 #D1AF52 #EEBB2B #D3A83A #C5A702 #9F8201 #E8CE03
C Magenta #FF00FF #E500E5 #F000B5 #CE009B #C0055B #B00085 #A82863 #5B002F #4B0121 #860225 #CB023D #64071A #9E0047 #DC7ACF
D Orange #FF9800 #FFA726 #FB8C00 #F57C00 #EF6C00 #FF9100 #FF6D00 #FD9A31 #7D2704 #FD571F #F86704 #FD9A00 #FE8A00 #F19652 #E58347 #C94C30 #9F5601 #FA6801 #F9A825 #BB723D
E Red #FF5252 #F44336 #EF5350 #E53935 #F6292E #FC252D #D32F2F #C62828 #BA2830 #B71C1C #D50000 #DB0806 #CF0904 #D81A14 #CC1708 #D80807 #DE2616 #EE240F #A1211F #701219 #511218 #491114
F Pink #FCE4EC #FDC8EB #E79FA6 #F8BBD0 #F48FB1 #FF80AB #FF4081 #F50057 #F06292 #EC407A #E91E63 #D81B60 #C2185B
        Black:  "black",  // 0
    Brown:  "brown",  // 1
    Grey:   "grey",   // 2
    White:  "white",  // 3
    Purple: "purple", // 4
    Gold: "gold",     // 5
    Blue:   "blue",   // 6
    Cyan:   "cyan",   // 7
    Teal:   "teal",   // 8
    Green:  "green",  // 9
    Lime:   "lime",   // A
    Yellow: "yellow", // B
    Magenta: "magenta",  // C
    Orange: "orange", // D
    Red:    "red",    // E
    Pink:   "pink",   // F

HCL vs HSL

See also https://github.com/lucasb-eyer/go-colorful#so-which-colorspace-should-i-use

Issues