Feedback wanted on Colored Highlight proposal

Beta Development feedback request
1

While highlighted text is not part of the markdown standard, it is starting to be a commonly supported extension using the == syntax, for example ==highlighted text==. Still it is a popular request also to have support for different colors like this:
CleanShot 2024-06-14 at 11.58.46@2x

What has been holding us back is that we didn’t know how to represent the colors in Markdown. But now we have a suggestion and would like your feedback. The idea is to use the colored circles from Unicode like this:

==🟢Green==, ==🔴red==, and ==🔵blue== highlights.

So, even in plain text, the color would be visible. And if you move the text to an editor that does support highlight Markdown, but not this color extension, it would look like this (this example is from Obsidian):
CleanShot 2024-06-14 at 12.07.52@2x

When used in Bear, it would look like the top screenshot, and the color saturation and lightness will be adjusted to fit the current theme. These are all the possible colors that we could support 🔴 🔵 🟢 🟡 🟠 🟣.

If no color is specified, it will look as today with a highlight color that fits the theme.

Let us know your thoughts on this proposal!

22 Likes
3

That is indeed a clever idea as it avoids cryptic mark up that appear to be ugly in plain text or in other editors. Wherever you see the text the highlights keep their meaning visually.

Do you already have an idea how the user would pick the desired colour at writing in a convenient way?

You probably mean that no further colour is technically possible? Otherwise i would ask i you could add pink/magenta as seventh colour. In combination with the eight colour (bears normal colour without any specifikcation) we could have the same system and number of clours like in zotero. That is not essential for survival but who knows :smiley:

4

Do you already have an idea how the user would pick the desired colour at writing in a convenient way?

Obviously it would be available through menus and perhaps some shortcuts. But it would also be nice if one could just type away like with other markdown syntax. Typing the color patches is not very easy so ideas about this are welcome.

You probably mean that no further colour is technically possible?

Yes. Those are the only feasible onces to choose from in Unicode. Also there is a point in limiting the number of colors. Remember that what might be a clear red in one theme might look like a more pale pink in another.

1 Like
5

Changing the already existing highlight colour by context menu is nice. But i am not sure if it is convenient when setting the colourt he first time. I would be satisfied after finishing a highlight at writing by the second “==” that a small popup appears with the coloured circles. Something like that

3 Likes
6

or maybe do it like =r= for red =y= for yellow etc.

1 Like
7

This is an alternative that we have considered. It is easier to write but harder to read, and it is less compatible with other apps like Obsidian. But we are interesting to hear what you think.

=g=Green==, =r=red==, and =b=blue== highlights.

vs

==🟢Green==, ==🔴red==, and ==🔵blue== highlights.
8

I definetely prefer the coloured unicode circles. As you can see in the example from obsidian it is visually more pleasing and wouldn’t break compability to obsidian and other tools. Especially in regard to upcoming panda versions compabiluty is even more important than in bear. The idea with Unicode circles is so smart that I wouldn’t go one step back

3 Likes
9

I would stick with the same alias method for the links. It’s easy to remember because we already use it.

==R|some text== for red

10

This sounds like a good compromise to have compatible markdown syntax that won’t “break” in other applications while providing Bear app users the desired formatting.

My only concern is how easily these Unicode circles can be typed without having to reach for the mouse to click on a menu/toolbar item.

1 Like
11

Whichever solution is found that is based on the initial letter of the respective color designation, there will be a decisive disadvantage: the initial letters are English. The circles, on the other hand, speak a universal language

1 Like
12

I like my own suggestion of a pop-up-list :grin:

Here a quick and dirty concept:

  • After typing “==“ immediately a vertical or horizontal list with all colours pops-up

  • If the user doesn’t choose a colour and continues typing then the pop up disappears and bear uses its normal highlight colour that matches the theme

  • But if the user wants a special colour he has to pick it from the list, either by mouse or (more important way) by arrow keys of the keyboard. Also here continuing typing with any other key closes the pop up

  • If the formatting is visible (cursor inside highlighted text) a click on an already existing coloured circle opens the popup again. A dedicated hotkey also opens the popup.

3 Likes
13

I agree. One of the best things with markdown is that it can just be typed, without remembering shortcuts. We could provide suggestions, like we do for emojies. As @krssno said, when you type ==, you could directly select between the displayed colors. But it wouldn’t be quite the same as just typing.

Another option is that we have triggers replacing the text. So if you type ==r and then press space, we would replace it with ==🔴. That would make for easy typing, but it is not very discoverable. Also, it would require you to think about the english color names.

Yet another option would be to add the color circles to our emoji suggestions. So you could type ==:r and then press enter (with the right sorting of the emojis listed).

The options above are not mutually exclusive so we could do two or all three.

5 Likes
14

I like @krssno suggestion, but I don’t know how I feel about auto-popping up a menu every time after typing ==. I would think choosing a specific highlight color would be the exception rather than the rule, but I could be wrong.

I like the suggestion of giving the user the choice of typing ==: and presenting the color circle emojis at the top of the list, regardless of the letter typed (to avoid having to deal with English color names). Yes, it’d be nice if the red circle was auto selected when typing ==:r :slight_smile:

3 Likes
15

This has the benefit of preserving highlight for other editors, and it is easy to type. It doesn’t read as nicely and it depends on english naming of the colors. What is the most important pro for you with this suggestion?

1 Like
16

and it depends on english naming of the colors

maybe you could use numbers. =1= for Highlight color 1 =2= for color 2 etc.
Had this setup with a NotePlan Theme a while ago.

17

I assume that actually there doesn’t seem to be a necessity to type “==“ without wanting to start a highlighted. Also the popup would disappear immediately when typing continues. Although the arrow keys help selecting a colour I see that it distracts from typing and makes it necessary to watch what happens in the pop up list. Typing “y”, “o”, “b”, “g”, “r” or “p” is definitely faster.

Rexicans idea to implement a combination of both ways is a good one assuming that a visual popup lis is not going to distract keyboard oriented users

18

The first letter of the english names for the colour is far more easy to remember than numbers. They would work but i guarantee that many people will struggle with remembering

19

The main advantage for me with this suggestion is consistency and ease of recall. By using ==R|some text== for red, we maintain a uniform method that’s intuitive because it aligns with our current practices. This not only makes it simpler for us to remember but also ensures that other editors can easily understand and follow the same convention. Importantly, this method relies on internationally recognized color names, which enhances clarity and simplicity in our workflow. Additionally, it allows flexibility by potentially accommodating the full spelling of colors through autocomplete, rather than just a single character.

20

I might prefer the =r= or ==r| option, and I’m not opposed to a visual pop-up, but however you guys decide to implement this feature, I’m here for it!

One thing I would like to see is that each color be a distinct sub menu item so you could set your own custom keyboard shortcuts for specific colors on mac

1 Like