推しをみながらコードを書きたい！！【VSCodeに背景画像を設定】

経緯

推しをみながらコードを書きたい！

素敵なイラスト：https://x.com/nkymyura/status/1783349003767443792

拡張機能

background

使い方

拡張機能からbackgroudをインストール

コマンドパレットからUser Settingを開く

コマンドパレットの開き方
Windows/Linux: Shift + Ctrl + P , Mac: Shift + Command + P

User Settingに設定を記述

  "background.fullscreen": {
    "images": ["xxxxxxxx"],
    "opacity": 0.85,
    "size": "900 900",
    "position": "right bottom",
    "interval": 0
  },

"images": []

画像のパスを指定します．
URLもしくはファイルパス（file:///~/~.png）を指定します
※URLはhttps通信のものを使用
画像を複数指定することも可能

"images": [
    file:///xxx/xxx_1.png,
    file:///xxx/xxx_2.png,
    ]

"opacity": xx.x,

画像の透明度を設定します．
0.85~0.95がおすすめだそうです

"size": "xxx"

画像のサイズを設定します
CSSのbackground-sizeに相当
cover，contain，900 900のように設定できます

"position": "xxx"

画像の位置を設定します
CSSのbackground-positionに相当
デフォルトはcenter

"interval": xxx

次の画像を表示するまでの時間を指定します（秒数）
0の場合，画像は変更されない
画像を複数指定している場合はintervalの値を設定することで画像の切り替えが可能