Beautiful Block Colors

Hi, I love that you can change the colors of the blocks by right clicking on the bullet points but the choice of colors are pretty poor in my opinion.

Better colors are important for the following reasons:

  • They make the app more pleasant to use
  • Better contrasting colors allows for clearer division of categorization
  • If we had clear red, orange and green colors, it allows the use of a traffic light color coding system that is very useful for rating / giving a status to blocks.

You currently have 7 colors, so I propose you change them to the following colors:

Brighter Colors

Red = Hex code: #F5848D
Orange = Hex code: #FEC98F
Yellow = Hex code: #FDFD95
Green = Hex code: #ADFFC4
Blue = Hex code: #59CCFF
Purple = Hex code: #B8ACFF
Gray = Hex code: #D5D5D5

Or if you prefer lighter colors, then these:

Lighter Colors

Orange = Hex code: #FFD6A5
Yellow = Hex code: #FDFFB6
Green = Hex code: #CAFFBF
Blue = Hex code: #9BF6FF
Purple = Hex code: #BDB2FF
Gray = Hex code: #DFDFDF

Thanks for the idea. I modified this concept into custom css for specific tags and it seems to work really well.

/*
Red = Hex code: #FFADAD
Orange = Hex code: #FFD6A5
Yellow = Hex code: #FDFFB6
Green = Hex code: #CAFFBF
Blue = Hex code: #9BF6FF
Purple = Hex code: #BDB2FF
Gray = Hex code: #DFDFDF
*/
div.block-content-inner:has(a.tag[data-ref="cr"]) {background-color: #FFADAD}
div.block-content-inner:has(a.tag[data-ref="co"]) {background-color: #FFD6A5}
div.block-content-inner:has(a.tag[data-ref="cy"]) {background-color: #FDFFB6}
div.block-content-inner:has(a.tag[data-ref="cg"]) {background-color: #CAFFBF}
div.block-content-inner:has(a.tag[data-ref="cb"]) {background-color: #9BF6FF}
div.block-content-inner:has(a.tag[data-ref="cp"]) {background-color: #BDB2FF}
div.block-content-inner:has(a.tag[data-ref="ca"]) {background-color: #DFDFDF}

So, now any block tagged with #cr will have a red background, #cy will have a yellow background, etc.

This can be closed. It was implemented in https://github.com/logseq/logseq/pull/6821
@Bader

1 Like