README file from
GithubFast Text Color
This Obsidian plugin allows you to create beautifully colored interactive notes using a custom coloring syntax.
Features
- Wide variety of available formatting options
- Full live preview support
- Multiple ways of applying/removing color to suit your individual needs
- Multiple intuitive editor integrations
- Custom coloring syntax that neatly integrates into Obsidian Markdown
- Keyboard-only usage possible
- Bundle formatting presets into themes
- Override active theme for individual notes through Frontmatter property
- No exposed HTML in the editing view
- Further in-depth customization using CSS classes
Usage
Color text sections using the following syntax:
~={id} This text is colored according to the id=~
The id maps to one of the color formats provided by the current active theme, which can be selected in the settings.
The formatting options include:
- $\textsf{{\color[rgb]{1.0, 0.0, 0.0}T}{\color[rgb]{1.0, 0.5, 0.0}e}{\color[rgb]{1.0, 1.0, 0.0}x}{\color[rgb]{0.0, 1.0, 0.0}t~ }{\color[rgb]{0.0, 1.0, 1.0}c}{\color[rgb]{0.0, 0.0, 1.0}o}{\color[rgb]{0.33, 0.0, 0.5}l}{\color[rgb]{1.0, 0.0, 1.0}o}{\color[rgb]{1.0, 0.0, 0.5}r}}$: custom or provided by the active Obsidian theme.
- Bold
- Italics
- Under-, o̅v̅e̅r̅-, and
throughlines - FULL CAPS, Sᴍᴀʟʟ Cᴀᴘs
These options are handled using CSS classes, which means that any changes will be applied to preexisting sections marked with the respective id retroactively.
Themes
Colors are bundled into themes, which can be created and edited in the plugin settings. You can also pick the global active theme there.
If you want to override your global active theme for a specific note, you can do so by setting the frontmatter property ftcTheme to the name of the theme you wish to use.
Applying Color
Editor Context Menu
Right clicking on highlighted text lets you change the color via the context menu. All colors included in the current theme will be available.
Interactive Delimiter
If the interactive delimiter option is enabled in the settings (default), you can change or remove the color of text using the interactive delimiter shown in place of the color name.
Command
Calling the change text color command lets you choose one of the colors that are available from the currently selected theme using a suggester modal.
Coloring Menu
If the option Use keybindings and colormenu is set, calling the change text color command instead opens the coloring menu.
You can select a color by clicking the corresponding button or using the keybind assigned in the theme editor.
Known Issues
These issues mainly arise from the different techniques required for live preview and reading mode and will be fixed in the future.
- Reading Mode.
- An unopened closing delimiter
=~will lead to problems in reading mode.
- An unopened closing delimiter
Planned Features
- Selectable color themes
- More/better ways to apply color
- Submenu in editor context menu
- Suggester modal
- Changing color through interactive delimiter
- Individual commands for theme colors
- Automatically color by keyword
- More (custom) CSS options
- Full note commands (color by keyword etc.)
How It Works
This plugin uses a custom parser, which allows the coloring to interact with the established Obsidian Markdown syntax. A CSS class containing the specified style options is created for each color id.