YAML

YAMLコードスクリーンショット生成

YAMLのスニペットを、Macから離れることなく共有したくなる画像に。

YAML のスクリーンショットはほぼ必ず CI の設定で、問題になるのもほぼ必ずインデントです。

Codeshotは貼り付けたコードからYAMLを判別するので、言語の選び間違いは起きません。付属する30種類のうち3つのテーマで同じスニペットを、アプリ自身のスタイルシートで表示しています。

name: build
on:
  push:
    branches: [main]

jobs:
  site:
    runs-on: macos-latest
    steps:
      - uses: actions/checkout@v4
      - run: npm ci && npm run build

Edge · ダーク

name: build
on:
  push:
    branches: [main]

jobs:
  site:
    runs-on: macos-latest
    steps:
      - uses: actions/checkout@v4
      - run: npm ci && npm run build

GitHub · ダーク

name: build
on:
  push:
    branches: [main]

jobs:
  site:
    runs-on: macos-latest
    steps:
      - uses: actions/checkout@v4
      - run: npm ci && npm run build

Solarized · ダーク

YAMLに合うテーマ選び

空白がそのまま構文なので、入れ子のすべての階層が 1 枚に収まる長さにとどめてください。この場合にかぎり、行番号は役に立ちます。

サイズを正しく決める

画像サイズを内容に合わせるか、比率で固定します（1:1、4:3、3:2、16:9、9:16、2:3、3:4）。そのうえで1×・2×・3×から選んで書き出せば、Retinaディスプレイでも鮮明なままです。⌘⇧Cでクリップボードに直接コピー、または⌘Sで保存できます。

30種類のテーマを見比べるか、全体の流れをご覧ください。

YAMLと、ほかの59言語のために

すべてMac上で動作します。コードが外に出ることはありません。

macOS版をダウンロード