Style Settings plugin support - chrisgurney/obsidian-note-toolbar GitHub Wiki

Via the Style Settings plugin, it is possible to further customize the colors, positioning, sizing, spacing, and more of your toolbars, even if you don’t have knowledge of CSS.

Usage

  1. Install the Style Settings plugin from Community Plugins and enable it.
  2. Under Community Plugins > Style Settings, expand the Note Toolbar section.

[!tip] To see your changes more easily, open Style Settings in a new tab by running the Show style settings view command.

Available styles

Styles are grouped under these headings in the Style Settings plugin:

  • Floating Button
  • Items
  • Menus
  • Quick tools
  • Separators
  • Toolbars
  • Toolbars (bottom)

πŸ’‘ Tips

General tips

  • The second slider in the color picker allows you to set transparency.
  • To reset all changes, at the top to the right of "Note Toolbar" click the πŸ”„ icon (Reset all settings to default).
    • ⚠️ Note that it's not possible in that plugin to reset all styles (in particular colors) to the theme's styles, so you'll need to reset everything (or set the style).

Toolbars

  • Regarding transparency for the toolbar itself, or buttons/links on top of it:
    • When Position = Below Properties note content will be able to show through the toolbar, as the toolbar floats above it.
    • When Position = Top the toolbar is inserted underneath the tab's header. In this case, unfortunately it's not possible to have a transparent background.

Floating buttons

  • Set the floating button's position to the top by setting the Y position on mobile to a smaller number, e.g., 20 works on an iPhone 15.

Menus

  • To be able to style menus, make sure this setting is disabled in Obsidian's settings: Appearance β†’ Advanced β†’ Native menus

More information about Style Settings

Get support for the Style Settings plugin here:

Return To: Styling toolbars