The end goal is to try and make these configurations easy to edit for designers. In the meantime, I think this is still an area where we don't have a lot of data points to know what the best practice should be. It's really common to arbitrarily scatter these values across html/css/javascript which is not what we want to do. Having said that, here's some thoughts to get started. If the value is rarely going to change, then top level defs in namespaces might make sense. If the value is really only related to a component, then you can just make it a component property with a default value. That looks something like:

(defui my-component [{:keys [foo]}]
  (let [foo (or foo 42)]
    ...))

(defui my-component [{:keys [^:membrane.component/contextual
                             accent-color]}]
  (ui/filled-rectangle accent-color
                       10 20))

For a much longer, more general explanation on the subject, there's this section https://blog.phronemophobic.com/reusable-ui-components.html#Incidental-State

I'm in the process of working on some new stuff that should help with features like resizable components, number sliders, and scrollviews. The thing these all have in common is that once you start dragging, you want the drag events to respond to any mouse move in the window, not just within the initiating component's bounds.

I'm thinking every part of the UI should be configurable in any context, but right now I don't know how to give a user an option to change fonts, sizes, colors, component sizes, etc

I would start with putting that type of info in contextual properties

Alright, I'll read up on it

Would love to hear your thoughts if you get to try some of the ideas out. I think there's a lot of low hanging fruit here, but not all of the answers are obvious.