Power Mode is one of the most requested extensions for VS Code. Unfortunately, they said it couldn't be done...
However, after seeing this list and realizing that VS Code was the only modern editor without it, I knew I had to try. I couldn't let VS Code live in the shadow of its big brother or Atom.
I present you, VSCODE POWER MODE!!! (now with atom-like explosions!)
To enable, add "powermode.enabled": true
to your settings.
You can now choose explosions with a single setting: powermode.presets
. Check out the options below (note: it looks better IRL than in these gifs):
Note: If your code becomes hard to read, you may need to set editor.lineHighlightBackground
in your user or workspace settings. For example, if your theme is Default Dark+
, try:
"editor.lineHighlightBackground": "#1E1E1EAA"
Hopefully power mode will work great for you out of the box, but if it doesn't I've tried to make power mode as configurable as possible. Tweak the settings for performance or for fun. From doge to clippy, the only limit is your imagination. Some of the options are explained below:
powermode.customExplosions
: Choose your own explosions with base64 encoded gifs or full URIs (i.e. "data:image/gif;base64,1337GIF", "C:/my/cat/gif", "https://coolgif.io")powermode.backgroundMode
: mask
will use the gif as a mask, letting the shape of the gif through with the color of the text. image
will use the gif itself as the background.
powermode.gifMode
: restart
will restart a gif each time it is displayed, continue
will play the gif from the place it stopped. continue
is particularly useful when you only have 1 visible gif, restart
is useful when you have multiple, but may reduce performance.powermode.maxExplosions
: Reducing this will reduce the number of explosions rendered at once.powermode.explosionFrequency
: Increasing this will increase the number of keystrokes between explosions. It means that there will be gaps between explosions as you type but may help performance.powermode.customExplosions
: Provide your own gifs to use (And share them here)powermode.customCss
: Changes the CSS applied to the "after" pseudoelement. You can experiment with ways to make it look or perform better.powermode.explosionOrder
: sequential
will cycle through explosions in order, random
will pick one randomly, and providing a number will select the explosion at that (zero-based) index in the list of explosions.They were right when they said it can't be done. At least not properly. VS Code does not expose the DOM as part of the API. Instead this extension relies on using TextEditorDecorations to set css properties for ranges in the editor. This has a few limitations:
editor.renderWhitespace
is turned on. I don't know why, but if you want vertical shake without seeing the whitespace being rendered, you can use these settings:"editor.renderWhitespace": "all",
"workbench.colorCustomizations": {
"editorWhitespace.foreground": "#FFFFFF00"
},
If you can provide some lightweight, attractive gifs that improve how power mode looks and performs, I would be happy to include them! Share them here.
powermode.enableStatusBarComboCounter
and powermode.enableStatusBarComboTimer
to toggle status bar itemspowermode.presets
to choose between different built-in explosion setspowermode.backgroundMode
to allow 'atom like' explosions (explosions that match the color of the text being typed)powermode.legacyMode
powermode.explosionMode
to powermode.explosionOrder
powermode.settingSuggestions
此处可能存在不合适展示的内容,页面不予展示。您可通过相关编辑功能自查并修改。
如您确认内容无涉及 不当用语 / 纯广告导流 / 暴力 / 低俗色情 / 侵权 / 盗版 / 虚假 / 无价值内容或违法国家有关法律法规的内容,可点击提交进行申诉,我们将尽快为您处理。