This theme component includes basic settings for changing button colors without writing CSS.

Github repo: https://github.com/awesomerobot/discourse-button-styles

Installation: https://meta.discourse.org/t/how-do-i-install-a-theme-or-theme-component/63682

Preview: Example of what you can style with the settings in this theme

25%20AM: 689x216

What the settings look like:

37%20AM: 690x368

There are 6 button sets that can be styled in this component, along with a global style for adding rounded corners to all buttons (border-radius):

  • basic buttons
  • primary buttons
  • header buttons
  • nav pills
  • post controls
  • editor buttons

For advanced button styling you may also consider looking at the common.scss file as a starting point for your custom CSS. In the future I’ll be using what I learned here to reduce the number of CSS styles required to style buttons in Discourse (and I’ll maintain/simplify this theme as I go).