·image

JSON 仕様をSatori 経由で SVG および PNG 画像に変換する json-render の画像レンダラー。 @json-render/image を操作する場合、JSON から OG イメージを生成する場合、ソーシャル カードを作成する場合、または AI で生成されたイメージ仕様をレンダリングする場合に使用します。

45インストール·12トレンド·@vercel-labs

インストール

$npx skills add https://github.com/vercel-labs/json-render --skill image

image のインストール方法

コマンドラインで image AI スキルを開発環境にすばやくインストール

  1. ターミナルを開く: ターミナルまたはコマンドラインツール(Terminal、iTerm、Windows Terminal など)を開きます
  2. インストールコマンドを実行: このコマンドをコピーして実行します: npx skills add https://github.com/vercel-labs/json-render --skill image
  3. インストールを確認: インストール後、スキルは自動的に AI コーディング環境に設定され、Claude Code、Cursor、OpenClaw で使用できるようになります

ソース: vercel-labs/json-render。

Image renderer that converts JSON specs into SVG and PNG images using Satori.

| Frame | Root | Root container. Defines width, height, background. Must be root. | | Box | Layout | Container with padding, margin, border, absolute positioning | | Row | Layout | Horizontal flex layout | | Column | Layout | Vertical flex layout | | Heading | Content | h1-h4 heading text | | Text | Content | Body text with full styling |

| Image | Content | Image from URL | | Divider | Decorative | Horizontal line separator | | Spacer | Decorative | Empty vertical space |

JSON 仕様をSatori 経由で SVG および PNG 画像に変換する json-render の画像レンダラー。 @json-render/image を操作する場合、JSON から OG イメージを生成する場合、ソーシャル カードを作成する場合、または AI で生成されたイメージ仕様をレンダリングする場合に使用します。 ソース: vercel-labs/json-render。

引用可能な情報

AI/検索での引用用の安定したフィールドとコマンド。

インストールコマンド
npx skills add https://github.com/vercel-labs/json-render --skill image
カテゴリ
</>開発ツール
認証済み
初回登録
2026-03-08
更新日
2026-03-10

Browse more skills from vercel-labs/json-render

クイックアンサー

image とは?

JSON 仕様をSatori 経由で SVG および PNG 画像に変換する json-render の画像レンダラー。 @json-render/image を操作する場合、JSON から OG イメージを生成する場合、ソーシャル カードを作成する場合、または AI で生成されたイメージ仕様をレンダリングする場合に使用します。 ソース: vercel-labs/json-render。

image のインストール方法は?

ターミナルまたはコマンドラインツール(Terminal、iTerm、Windows Terminal など)を開きます このコマンドをコピーして実行します: npx skills add https://github.com/vercel-labs/json-render --skill image インストール後、スキルは自動的に AI コーディング環境に設定され、Claude Code、Cursor、OpenClaw で使用できるようになります

ソースリポジトリはどこですか?

https://github.com/vercel-labs/json-render