# Garble Text on screen to hide private info (with added features!) **URL:** \ **Category:** Themes & CSS snippets\ **Tags:** ui-ux, custom-css\ **Created:** [August 25, 2021, 11:00am UTC](https://forum.obsidian.md/t/garble-text-on-screen-to-hide-private-info-with-added-features/23143 "2021-08-25T11:00:14Z")\ **Posts on this page:** 20\ **Page:** 1
**Author:** ![Moonbase59](https://forum.obsidian.md/user_avatar/forum.obsidian.md/moonbase59/32/13648_2.png) [@Moonbase59](https://forum.obsidian.md/u/Moonbase59)\ **Post date:** [August 25, 2021, 11:00am UTC](https://forum.obsidian.md/t/garble-text-on-screen-to-hide-private-info-with-added-features/23143/1 "2021-08-25T11:00:14Z")
## Garble Text on screen to hide private info (with added features!) **New version 2021-08-27.** Adds CJK and other non-Latin languages hiding. _Not perfect, but works, see video below._ Sometimes one wishes to hide private information on a screen, maybe for doing a screenshot or just to avoid prying eyes. The developers have given us `app.garbleText()` for that, which can be used from the _developer console_ or from within a plugin like [Garble Text](https://github.com/kurakart/garble-text). Now I had a few **additional requirements** : - It should _also_ obfuscate _images_ and _SVGs_. - It should look more like a “mockup”. - It should _reveal_ hidden text and images on _mouse hover_ or _touch_ (on mobile). - Any fonts used should not come from the Internet but be included so that offline operation would be possible. - It should work on _all platforms_, including mobile (both Android and iOS). Thus, `garble-text.css` came into being. What `garble-text.css` **can’t** do: - garble file info popup text (in _file explorer_) - garble text in the _modals_ (unreadable settings, command palette and search suggester would be a pain anyway!) - garble note names in the _graph_ (that’s a _canvas_ so it can’t work on that) ### Installing the _Garble Text_ plugin Install the _Garble Text_ community plugin as usual. #### Correction for mobile use It can’t currently directly be used on mobile, I filed an [issue](https://github.com/kurakart/garble-text/issues/3) about that. It works alright, but the developer hasn’t yet allowed mobile use. So for now open the plugin’s `manifest.json` file in a text editor. It’s usually located in your vault’s hidden folder `./obsidian/plugins/garble-text/`. Find where it says ```json "isDesktopOnly": true ``` and modify as follows: ```json "isDesktopOnly": false ``` Save the file. #### Activate and set a hotkey Restart Obsidian and activate the plugin: ![garble-text-plugin-activate](https://forum.obsidian.md/uploads/default/original/3X/e/0/e07c4049f5eb80b6e425cc7675fc2f2111c975ad.png) Then set a **hotkey** for it. I used Ctrl+Shift+O (Obfuscate) for it: ![garble-text-plugin-hotkey](https://forum.obsidian.md/uploads/default/original/3X/2/5/25a8dacc98a82a735098673d850d802ded127314.png) #### Testing If your desktop looked like this ![garble-text-desktop-before](https://forum.obsidian.md/uploads/default/original/3X/8/b/8b796f1b260e0e313bfa6ed92d029bbf5d8839b7.jpeg) and you activate the hotkey combination, it should now look like this: ![garble-text-desktop-after](https://forum.obsidian.md/uploads/default/original/3X/8/4/842d6a1cabec09a1c362c5ea6fce25d44c6748f6.jpeg) You will notice that hovering the mouse cursor doesn’t help to reveal anything, and also the image is shown clearly. Use the hotkey combo again to switch off the obfuscation. ### Install the `garble-text.css` snippet Copy the following CSS code and save it into your vault’s hidden `.obsidian/snippets/` folder under the name `garble-text.css`. Should the folder not yet exist, create it first. #### CSS Code [garble-text.css](https://forum.obsidian.md/uploads/short-url/eLvHevRWKMZ6u0Qo6zAPxIm9YPR.css) (171.8 KB) **_Note:_ Some features will be available only after Obsidian includes Chromium 92+. They already work fine on Obsidian Mobile 1.0.4 (Android).** I’ve filed a [feature request](https://forum.obsidian.md/t/update-to-chrome-engine-92-font-face-size-adjust-needed/23252) for that. **Copy exactly as it is, don’t reformat, add linebreaks or such!** You might otherwise break the display fonts that are included in a highly-compressed format _(woff2)_. Thanks to Christian Naths for making the font and licensing it so freely! Restart Obsidian and activate this CSS snippet: ![garble-text-snippet-activate](https://forum.obsidian.md/uploads/default/original/3X/1/e/1eee1bf7938b1ac9e8784cfda933ad812229291d.png) #### Testing Now use the same hotkey combo you defined above to activate the “garbled” mode. Your desktop should now look like this: ![garble-text-desktop-with-css](https://forum.obsidian.md/uploads/default/original/3X/8/c/8c0ba4e1f0b356f726c2c490464bc195c1698a41.png) Experiment with hovering the mouse, use plugins, write a test note and check if everything works. Remember the hotkey is a _toggle_—each time you press it, the state will switch between normal and obfuscated. ### Mobile use _Hint:_ It’s much easier editing the plugin’s `mainifest.json` and creating the `garble-text.css` file _on the desktop_ first and then copying them over to the mobile device (or using Sync to do that). The plugin and the CSS snippet have been tested on both Android and iOS mobile devices and should work flawlessly. If using this feature more often, I recommend - pinning the “Garble Text: Toggle Garble Text” command to the _command palette_ so it’s always at the top, without searching - adding the “Garble Text: Toggle Garble Text” command to your _editor toolbar_, so you have it available with only one click. _Note:_ The developer hasn’t yet provided a toolbar icon, so it will show in the toolbar as a `?`. See [issue #4](https://github.com/kurakart/garble-text/issues/4). #### Short demo video The video is available [online](http://kaufen-ist-toll.de/download/obsidian/garble-text-mobile.mp4). There is another [video showing the new version hiding non-Latin glyphs](http://kaufen-ist-toll.de/download/obsidian/garble-text-mobile-new.mp4) on my Android phone. Not perfect, but at least _hides_. ![garble-text-mobile](https://forum.obsidian.md/uploads/default/original/3X/7/b/7b89ef7ef23783f46c23cebe0ffd52cb881c2b4f.jpeg) Screenshot (Android) ### Changelog - 2021-08-22 - Initial version, internal & external testing on desktop, laptop, Andoid and iOS. - Documentation. - 2021-08-25 - Initial release and published in Obsidian Forums. - 2021-08-27 - Updated to include “Last Resort” font that will hide non-Latin glyphs. ---
**Author:** ![Klaas](https://forum.obsidian.md/letter_avatar_proxy/v4/letter/k/ecc23a/32.png) [@Klaas](https://forum.obsidian.md/u/Klaas)\ **Post date:** [August 25, 2021, 2:51pm UTC](https://forum.obsidian.md/t/garble-text-on-screen-to-hide-private-info-with-added-features/23143/2 "2021-08-25T14:51:12Z")
@Moonbase59 good stuff Matthias, very useful. 1 small remark: I noticed you are using a mixture of `px` and `em`: aren’t you contravening your own recommendation? ---
**Author:** ![Moonbase59](https://forum.obsidian.md/user_avatar/forum.obsidian.md/moonbase59/32/13648_2.png) [@Moonbase59](https://forum.obsidian.md/u/Moonbase59)\ **Post date:** [August 25, 2021, 2:59pm UTC](https://forum.obsidian.md/t/garble-text-on-screen-to-hide-private-info-with-added-features/23143/3 "2021-08-25T14:59:17Z")
Yah, I am lol … but couldn’t really make the image blur dependent on some font size of an unknown parent element … ---
**Author:** ![Klaas](https://forum.obsidian.md/letter_avatar_proxy/v4/letter/k/ecc23a/32.png) [@Klaas](https://forum.obsidian.md/u/Klaas)\ **Post date:** [August 25, 2021, 3:05pm UTC](https://forum.obsidian.md/t/garble-text-on-screen-to-hide-private-info-with-added-features/23143/4 "2021-08-25T15:05:51Z")
@Moonbase59 OK, you’re forgiven 😂 ---
**Author:** ![obsidian337](https://forum.obsidian.md/letter_avatar_proxy/v4/letter/o/b19c9b/32.png) [@obsidian337](https://forum.obsidian.md/u/obsidian337)\ **Post date:** [August 25, 2021, 3:12pm UTC](https://forum.obsidian.md/t/garble-text-on-screen-to-hide-private-info-with-added-features/23143/5 "2021-08-25T15:12:40Z")
Wonderful feature! It doesn’t seem to work for CJK characters. Is it the problem of garble plugin? ---
**Author:** ![amrnt](https://forum.obsidian.md/user_avatar/forum.obsidian.md/amrnt/32/17110_2.png) [@amrnt](https://forum.obsidian.md/u/amrnt)\ **Post date:** [August 25, 2021, 3:15pm UTC](https://forum.obsidian.md/t/garble-text-on-screen-to-hide-private-info-with-added-features/23143/6 "2021-08-25T15:15:29Z")
Is there a way to make this work on the graph? This is where i would like to use this plugin the most. ---
**Author:** ![Moonbase59](https://forum.obsidian.md/user_avatar/forum.obsidian.md/moonbase59/32/13648_2.png) [@Moonbase59](https://forum.obsidian.md/u/Moonbase59)\ **Post date:** [August 25, 2021, 3:18pm UTC](https://forum.obsidian.md/t/garble-text-on-screen-to-hide-private-info-with-added-features/23143/7 "2021-08-25T15:18:30Z")
Hm. Maybe due to the rather restricted font I use (to keep it small). What happens if you _switch off_ the CSS snippet? Does it display lines correctly for the CJK chars? ---
**Author:** ![Moonbase59](https://forum.obsidian.md/user_avatar/forum.obsidian.md/moonbase59/32/13648_2.png) [@Moonbase59](https://forum.obsidian.md/u/Moonbase59)\ **Post date:** [August 25, 2021, 3:22pm UTC](https://forum.obsidian.md/t/garble-text-on-screen-to-hide-private-info-with-added-features/23143/8 "2021-08-25T15:22:18Z")
I don’t see one, since the graph is actually a canvas. It will obfuscate the menu, but sadly not the names … ☹ ![garble-text-sample-document (2021-08-25) - Knowledgebase - Obsidian 0.12.12_010](https://forum.obsidian.md/uploads/default/original/3X/a/4/a4cc7248413b2110f5ac6b05c991081e875cba7a.jpeg) Adding that to the description above, thanks! ---
**Author:** ![amrnt](https://forum.obsidian.md/user_avatar/forum.obsidian.md/amrnt/32/17110_2.png) [@amrnt](https://forum.obsidian.md/u/amrnt)\ **Post date:** [August 25, 2021, 3:23pm UTC](https://forum.obsidian.md/t/garble-text-on-screen-to-hide-private-info-with-added-features/23143/9 "2021-08-25T15:23:57Z")
Too bad, but an extremely useful plugin nonetheless. ---
**Author:** ![obsidian337](https://forum.obsidian.md/letter_avatar_proxy/v4/letter/o/b19c9b/32.png) [@obsidian337](https://forum.obsidian.md/u/obsidian337)\ **Post date:** [August 25, 2021, 4:01pm UTC](https://forum.obsidian.md/t/garble-text-on-screen-to-hide-private-info-with-added-features/23143/10 "2021-08-25T16:01:11Z")
Regardless of your CSS snippet On/Off, Egnlish alphabets are obfuscated.(The obfuscated patterns are somewhat different.). But, CJK characters are not obfuscated. ---
**Author:** ![Moonbase59](https://forum.obsidian.md/user_avatar/forum.obsidian.md/moonbase59/32/13648_2.png) [@Moonbase59](https://forum.obsidian.md/u/Moonbase59)\ **Post date:** [August 25, 2021, 6:29pm UTC](https://forum.obsidian.md/t/garble-text-on-screen-to-hide-private-info-with-added-features/23143/11 "2021-08-25T18:29:47Z")
You got a vaild test string for me? (I have no CJK keyboard and wouldn’t know the words anyway!) ---
**Author:** ![anon12638239](https://forum.obsidian.md/letter_avatar_proxy/v4/letter/a/2bfe46/32.png) [@anon12638239](https://forum.obsidian.md/u/anon12638239)\ **Post date:** [August 25, 2021, 6:50pm UTC](https://forum.obsidian.md/t/garble-text-on-screen-to-hide-private-info-with-added-features/23143/12 "2021-08-25T18:50:32Z")
This? I can’t get the CJK to garble. ```auto 你有一个有效的文本字符串给我吗？ （我没有 CJK 键盘，反正我不会知道这些词！） ``` Angel ![cjk](https://forum.obsidian.md/uploads/default/original/3X/c/1/c1653c3706b4b72a29ac7f61825faccfe7d1a3d5.png) [cjk.md](https://forum.obsidian.md/uploads/short-url/kPWYAOLPFEDIMJn0WxnMHOCoDk.md) (280 Bytes) ---
**Author:** ![Moonbase59](https://forum.obsidian.md/user_avatar/forum.obsidian.md/moonbase59/32/13648_2.png) [@Moonbase59](https://forum.obsidian.md/u/Moonbase59)\ **Post date:** [August 25, 2021, 7:04pm UTC](https://forum.obsidian.md/t/garble-text-on-screen-to-hide-private-info-with-added-features/23143/13 "2021-08-25T19:04:02Z")
Yup, thanks! Seems (both the dev’s and my) fonts don’t take the full Unicode range, hm. That would of course make them much larger, and I’m not really into font editing. Guess there _could_ be _one_ substitution character for all—or most—of them since almost all of these are rather “blocky”, but still the table would be _large_. So either we’d have to wait for someone who is _real good_ at font editing, or ask upstream, which could take a _loooong_ time. Thanks for providing the file, and 😆 with you just using my words! ---
**Author:** ![anon12638239](https://forum.obsidian.md/letter_avatar_proxy/v4/letter/a/2bfe46/32.png) [@anon12638239](https://forum.obsidian.md/u/anon12638239)\ **Post date:** [August 25, 2021, 9:01pm UTC](https://forum.obsidian.md/t/garble-text-on-screen-to-hide-private-info-with-added-features/23143/14 "2021-08-25T21:01:03Z")
Gern geschehen! 😇 Angel ---
**Author:** ![Moonbase59](https://forum.obsidian.md/user_avatar/forum.obsidian.md/moonbase59/32/13648_2.png) [@Moonbase59](https://forum.obsidian.md/u/Moonbase59)\ **Post date:** [August 25, 2021, 10:04pm UTC](https://forum.obsidian.md/t/garble-text-on-screen-to-hide-private-info-with-added-features/23143/15 "2021-08-25T22:04:28Z")
😁 Well, I experimented a little, using a font that has (almost) all Unicode code points, but only a _very few_ glyphs, all the same size. It’s still a multi-megabyte thing, so probably not worth the effort, and it looks horrible … ![garble-text-cjk - Knowledgebase - Obsidian 0.12.12_002](https://forum.obsidian.md/uploads/default/original/3X/e/2/e2cb436808615ce85bcbe05ddb15681eb186ef02.png) ![garble-text-cjk - Knowledgebase - Obsidian 0.12.12_001](https://forum.obsidian.md/uploads/default/original/3X/8/1/818fe1c901face3cc3223aa89392474d4a43760b.png) ---
**Author:** ![Moonbase59](https://forum.obsidian.md/user_avatar/forum.obsidian.md/moonbase59/32/13648_2.png) [@Moonbase59](https://forum.obsidian.md/u/Moonbase59)\ **Post date:** [August 27, 2021, 4:10pm UTC](https://forum.obsidian.md/t/garble-text-on-screen-to-hide-private-info-with-added-features/23143/16 "2021-08-27T16:10:12Z")
@anon12638239: There is a new version in the first post that uses the “wiggly lines” plus the above “blocks” for anything that it can’t display, i.e. CJK characters. See new description and [video](http://kaufen-ist-toll.de/download/obsidian/garble-text-mobile-new.mp4) and let me know if that could be a solution for you until we can have anything better, will you? ---
**Author:** ![anon12638239](https://forum.obsidian.md/letter_avatar_proxy/v4/letter/a/2bfe46/32.png) [@anon12638239](https://forum.obsidian.md/u/anon12638239)\ **Post date:** [August 27, 2021, 5:23pm UTC](https://forum.obsidian.md/t/garble-text-on-screen-to-hide-private-info-with-added-features/23143/17 "2021-08-27T17:23:39Z")
Hello. Personally, I don’t have a need to garble my text (because everything I write is garbled nonsense anyway, which no one else would ever want to read or understand), but I read this thread out of interest, saw your request for some CJK, and thought that I could help a little by providing a test file for you. I’m a meliorist by instinct. I apologise if my contribution was inappropriate in any way I have installed the plugin and css file and tested them on my Mac. Worked perfectly. Assume any CJK user with a need to garble their screen will find it easy to use and very convenient. Ingenious idea and implementation. Angel ---
**Author:** ![Moonbase59](https://forum.obsidian.md/user_avatar/forum.obsidian.md/moonbase59/32/13648_2.png) [@Moonbase59](https://forum.obsidian.md/u/Moonbase59)\ **Post date:** [August 27, 2021, 7:58pm UTC](https://forum.obsidian.md/t/garble-text-on-screen-to-hide-private-info-with-added-features/23143/18 "2021-08-27T19:58:29Z")
> [@anon12638239](#): > > meliorist Meliorism, yeah … believe in that too. Nothing inappropriate here, on the contrary! Thanks for your kind words! ---
**Author:** ![obsidian337](https://forum.obsidian.md/letter_avatar_proxy/v4/letter/o/b19c9b/32.png) [@obsidian337](https://forum.obsidian.md/u/obsidian337)\ **Post date:** [August 28, 2021, 1:33am UTC](https://forum.obsidian.md/t/garble-text-on-screen-to-hide-private-info-with-added-features/23143/19 "2021-08-28T01:33:19Z")
It works very well as shown in the video. Thnak you for your work. ---
**Author:** ![ksdavidc](https://forum.obsidian.md/letter_avatar_proxy/v4/letter/k/f475e1/32.png) [@ksdavidc](https://forum.obsidian.md/u/ksdavidc)\ **Post date:** [February 26, 2025, 8:19pm UTC](https://forum.obsidian.md/t/garble-text-on-screen-to-hide-private-info-with-added-features/23143/20 "2025-02-26T20:19:16Z")
I put in a feature request in the garble plugin for this, but will mention here, as this snippet is a very nice complement. In my case, I would like sometimes to NOT be able to see text EVEN ON MOUSEOVER. I just want full obfuscation. Also, it would be nice if one could obfuscate the GUI icons as well… But, very nice and look forward to using it. [Next page](https://forum.obsidian.md/t/garble-text-on-screen-to-hide-private-info-with-added-features/23143.md?page=2)