OneKitTools logoOneKitTools
開発者に戻る

HTMLを画像に変換

任意のHTML + CSSを高品質画像にレンダリング — カード、バナー、SNSグラフィックなど

HTMLを画像に変換 について

任意のHTML + CSSを高品質画像にレンダリングします。カード、バナー、SNSグラフィック、メールヘッダーに最適で、すべてブラウザ内で動作します。

HTMLを画像に変換 の使い方

  1. 1テンプレート(カード、バッジ、バナー、ソーシャルカード)を選択するか、ゼロから始めます。
  2. 2エディターでHTMLを書き、カスタムCSSスタイルを追加します。
  3. 3必要に応じてCSSフレームワークを選択し、ビューポート幅を設定します。
  4. 4透過背景を切り替え、エクスポートスケール(1x、2x、3x)を調整します。
  5. 5レンダリングされた画像をプレビューし、ダウンロードします。

ヒント

  • ハイDPIディスプレイには2xまたは3xスケールを使用してください。SNSグラフィックには特に重要です。
  • ソーシャルカードテンプレートはOpen Graph画像(1200x630)に事前サイズ設定されています。
  • 透過背景はオーバーレイの作成や後で画像を合成する場合に便利です。

関連ツール

OneKitTools チーム更新日 2.21.4