Blur

approved

by gapmiss

Create obfuscated blocks of text.

41 stars7,591 downloadsUpdated 1mo agoMIT

Blur

Light-weight Obsidian.md plugin for creating obfuscated blocks of text.

Installation

Install from community.obsidian.md

From Obsidian's settings or preferences:

  1. Community Plugins > Browse
  2. Search for "Blur"

Manually:

  1. download the latest release archive
  2. uncompress the downloaded archive
  3. move the blur folder to /path/to/vault/.obsidian/plugins/
  4. Settings > Community plugins > reload Installed plugins
  5. enable plugin

or:

  1. download main.js, manifest.json & styles.css from the latest release
  2. create a new folder /path/to/vault/.obsidian/plugins/blur
  3. move all 3 files to /path/to/vault/.obsidian/plugins/blur
  4. Settings > Community plugins > reload Installed plugins
  5. enable plugin

Usage

2 modes:

  1. inline
  2. block i.e. code fence

3 methods:

  1. blur — useful for ==obfuscating== (text preserved, reveals on hover)
  2. brick — useful for ==redacting== (text replaced with █ blocks, does not reveal)
  3. bone — useful for ==wire-framing== (text preserved, reveals on hover)

inline

blur
Alpha Bravo Charlie `~{Delta}` Echo Foxtrot Golt Hotel India Juliet `~{Kilo}` Lima Mike November Oscar `~{Papa}` Quebec Romeo Sierra Tango Uniform Victor `~{Whiskey}` Xray Yankee Zulu
brick
Alpha Bravo Charlie `~[Delta]` Echo Foxtrot Golt Hotel India Juliet `~[Kilo]` Lima Mike November Oscar `~[Papa]` Quebec Romeo Sierra Tango Uniform Victor `~[Whiskey]` Xray Yankee Zulu
bone
Alpha Bravo Charlie `~(Delta)` Echo Foxtrot Golt Hotel India Juliet `~(Kilo)` Lima Mike November Oscar `~(Papa)` Quebec Romeo Sierra Tango Uniform Victor `~(Whiskey)` Xray Yankee Zulu

block

blur
```blur
Alpha Bravo Charlie Delta Echo Foxtrot Golt Hotel India Juliet Kilo Lima Mike November Oscar Papa Quebec Romeo Sierra Tango Uniform Victor Whiskey Xray Yankee Zulu
```
brick
```blur-brick
Alpha Bravo Charliez Delta Echo Foxtrot Golt Hotel India Juliet Kilo Lima Mike November Oscar Papa Quebec Romeo Sierra Tango Uniform Victor Whiskey Xray Yankee Zulu
```
bone
```blur-bone
Alpha Bravo Charlie Delta Echo Foxtrot Golt Hotel India Juliet Kilo Lima Mike November Oscar Papa Quebec Romeo Sierra Tango Uniform Victor Whiskey Xray Yankee Zulu
```

results

screenshot of results in light mode

screenshot of results in dark mode


settings

The plugin includes a Reveal on hover toggle in Settings > Blur. When enabled, hovering over blurred or boned text will reveal the original content. Note: brick text does not reveal on hover since the original text is replaced with █ blocks.


customization

Custom CSS styles can be applied via the obsidian-style-settings plugin.

video demo

effects

  1. blurfilter
  2. brickline-height, background-color, border-radius
  3. boneline-height, background-color, border-radius

screenshot of plugin style-settings

CSS snippet for setting styles

The obsidian-style-settings plugin is required for the following.

  1. create an obsidian-blur-plugin.css snippet file with the content below

or

  1. download obsidian-blur-plugin.css

then

  1. save file to /path/to/vault/.obsidian/snippets
  2. enable snippet under Settings > Appearance > CSS snippets
/* @settings

name: Blur Plugin
id: obsidian-blur
settings:
-
  id: obsidian-blur-filter
  title: Blur filter strength
  type: variable-text
  default: 5px
-
  id: obsidian-blur-brick-color
  title: Brick color
  type: variable-themed-color
  format: hsl
  opacity: true
  default-light: 'hsla(220,19%,6%,1)'
  default-dark: 'hsla(220,100%,100%,1)'
-
  id: obsidian-blur-brick-border-radius
  title: Brick border-radius
  type: variable-text
  default: 1px
-
  id: obsidian-blur-brick-line-height
  title: Brick line-height
  type: variable-number-slider
  default: 1
  min: 1
  max: 2
  step: .05
- 
  id: obsidian-blur-bone-color
  title: Bone color
  type: variable-themed-color
  format: hsl
  opacity: true
  default-light: 'hsla(220,19%,6%,1)'
  default-dark: 'hsla(220,100%,100%,1)'
-
  id: obsidian-blur-bone-border-radius
  title: Bone border-radius
  type: variable-text
  default: 1.5em
-
  id: obsidian-blur-bone-line-height
  title: Bone line-height
  type: variable-number-slider
  default: 1
  min: 1
  max: 2
  step: .05
-
*/

development

clone this repo

cd /path/to/vault/.obsidian/plugins
git clone https://github.com/gapmiss/blur.git
cd blur

install packages and run

npm i
npm run dev

enable plugin

  1. open SettingsCommunity plugins
  2. enable the Blur plugin.

For plugin developers

Search results and similarity scores are powered by semantic analysis of your plugin's README. If your plugin isn't appearing for searches you'd expect, try updating your README to clearly describe your plugin's purpose, features, and use cases.