Coda UX: Pretty Pastel-Colored Buttons

[Xyzor_Max]

Several of my clients have commented on how gaudy and glaring the default Coda buttons are - bright primary colors like something a montessori kid might do with crayons (client quote).

So we have avoided colored buttons except for special cases, and limited ourselves to white and grey buttons.

So I decided to find a way to create buttons that have the same quite, pleasant, pastel-shades that are used for Call-Outs.

The trick is to build a table to design your buttone in (lets call it Buttons) with a single Canvas-Column (lets call it Button) and inside it we create a Call-Out in our chosen color, with no icon, and inside that we create our Button - no label - just an icon - size=small - color=white. Then beside that we add the text-label and set the paragraph-style to H3.

Now we can render a nice looking button with the formula Buttons.Button.Nth(N) where N is the number of the row containing the button you need. The user needs to click on the icon, but they seem to do that quite naturally. It looks way nicer this way…

Respect
Max
CTO, Agile Dynamics Lab

[Harry_Roper]

These look gorgeous Max!

[Paul_Danyliuk]

A nice trick indeed!

I tried making buttons with custom colors earlier but couldn’t. The closest I got to color-accenting without painting the whole button with a bright color was this:

Set the color of the button based on some criteria

+1 FYI if you need any sort of distinction, what you can do at the moment is keep all the buttons white and change text color using _Color() formula on the label [image]

Let me quickly check something though. Maybe I can actually force a custom color onto a button?..

(UPD: no, unfortunately we’re only confined to the selection of named colors we have; no way to force a custom color on a button)