Style Settings
by mgmeyers
favorite
share
1281
1,276,202
Description

You're an Obsidian plugin developer, and you publish a blog post every week to share updates on the latest plugins that have been released. Here's your template for this week's post:

Obsidian Plugins Updates: [Week Number]

In this update, we are excited to announce the release of several new plugins for the Obsidian community. We will cover each plugin in detail below.

Plugin 1 - [Plugin Name]

This plugin adds a feature that allows users to… (briefly describe what the plugin does). It includes two main settings:

  • Setting 1: [Setting description]
  • Setting 2: [Setting description]

You can customize these settings by using the following CSS variables:

--var: [value];

For example, if you set --var to #007AFF, it will output hsl(211, 100%, 50%).

Plugin 2 - [Plugin Name]

This plugin introduces a new theme setting for… (briefly describe what the plugin does). It includes three main settings:

  • Setting 1: [Setting description]
  • Setting 2: [Setting description]
  • Setting 3: [Setting description]

You can customize these settings by using the following CSS variables:

--var: [value];

For example, if you set --var to #2DB253, it will output hsl(211, 100%, 50%).

Plugin 3 - [Plugin Name]

This plugin provides a new formatting option for… (briefly describe what the plugin does). It includes two main settings:

  • Setting 1: [Setting description]
  • Setting 2: [Setting description]

You can customize these settings by using the following CSS variables:

--var: [value];

For example, if you set --var to #007AFF, it will output hsl(211, 100%, 50%).

Localization Support

Translations for titles and descriptions can be supplied for each language Obsidian supports by using one of the following postfixes:

en: English
zh: 简体中文
zh-TW: 繁體中文
ru: Pусский
ko: 한국어
it: Italiano
id: Bahasa Indonesia
ro: Română
pt-BR: Português do Brasil
cz: čeština
de: Deutsch
uk: Українська
sq: Shqip
tr: Türkçe

Color Gradient formatting options

There are 8 formatting options:

  • hex
  • rgb
  • rgb-values
  • hsl
  • hsla
  • hsl-split
  • hsl-split-decimal
  • color-gradient

For example, if you set --accent to #007AFF, it will output hsl(211, 100%, 50%).

Plugin Support

Plugins can specify a style setting config in the plugin's CSS. Plugins must call app.workspace.trigger("parse-style-settings") when the plugin loads in order for Style Settings to be notified of CSS changes.

That's it for this week's update! We hope you enjoy these new plugins and look forward to hearing your feedback. Happy coding!

Latest Version
3 months ago
Changelog

f26cfa0 Upgrade libs and fix type errors
5cbf4e7 1.0.8
4ce9491 Fix #152
51a1497 Merge pull request #128 from ThePyroTF2/update_readme
6418dea Add documentation for the quotes key of the variable-text setting type

README file from
Similar Plugins
info
• Similar plugins are suggested based on the common tags between the plugins.
Day and Night
2 years ago by Kevin Patel
An Obsidian plugin to automatically toggle themes between day theme and night theme on a set time schedule.
Theme Toggler
2 years ago by larsmagnus
Toggle the theme in Obsidian's panels.
Webpage HTML Export
2 years ago by Nathan George
Exports an obsidian document, folder, or vault as an HTML document / webpage / website with correct styling. Also has an interactive embedded dark / light theme toggle, and document outline.
Canvas CSS class
2 years ago by Lisandra-dev
Add a CSS class to the canvas, but also other attributes.
Mermaid Themes
a year ago by jvsteiner
Alternate support for mermaid.js that supports themeing and customization.
Style Text
a year ago by Juanjo Arranz
Apply custom CSS styles to selected text in your Obsidian Notes.
CSS Editor
a year ago by Zachatoo
Edit CSS snippet files within Obsidian.
Sheets Extended
a year ago by NicoNekoru
Vertical headers, merged cells, and custom css tables with advanced table compatability
Show Whitespace
a year ago by Erin Schnabel
CSS styles and CM6 extensions to highlight whitespace in Source and Live Preview modes
Color cycler
9 months ago by Taylor Brennan
Dynamically change the accent color of the theme.
Regex Mark
6 months ago by Mara-Li
Add custom CSS classes to text based on regular expressions.
Explorer Hider
6 months ago by Mara-Li
Hide a file or a folder from the explorer (and bookmarks) using a little bit of auto-managed CSS.
Magic Move
5 months ago by imfenghuang
Animating code blocks with markdown and code syntax highlighting with beautiful themes.
CSS Inlay Colors
3 months ago by Benji Grant
Show inline color hints for CSS colors
CSS Inserter
3 months ago by Erika Gozar
Inserts user-defined CSS snippets into the selected text.
Live Variables
3 months ago by Hamza Ben Yazid
Define variables in your note's properties and reuse them throughout your content.
Minimal Theme Settings
2 months ago by @kepano
Control the colors and fonts in Minimal Theme.
css snippets
2 months ago by Daniel Brandenburg
Load and manage CSS snippets.
Discordian Theme
2 months ago by @radekkozak
Fine-grained control of Discordian Theme.
Theme Picker
2 months ago by kenset
Quickly preview and select installed themes.
Snippet Commands
2 months ago by death_au
Register custom CSS snippets as commands (which you can bind hotkeys to).
Auto Class
2 months ago by Nathonius
Automatically apply CSS classes to Markdown views based on a note's path.
Theme Design Utilities
2 months ago by pseudometa
Some utilities and quality-of-life features for designers of Obsidian themes.
Auto switch themes between dark/light mode
13 days ago by Robert Storlind
Toggling dark/light mode switches themes automatically