Base64Img

Private browser-based Base64 tools.

Language

画像をCSS Base64に変換

Base64 Data URL画像を含むCSS background-image宣言を生成します。

Runs locally in your browser

使い方

  1. 入力を貼り付けるか、このデバイスからファイルを選択します。
  2. 変換を実行し、検出されたタイプまたはプレビューを確認します。
  3. 結果をコピーするか、プロジェクト用にダウンロードします。

CSS背景画像向けに設計

小さな画像をインライン化するとネットワークリクエストを減らせますが、大きなアセットは通常キャッシュファイルとして扱う方が適しています。

登録、透かし、キュー、サーバーへのアップロードは不要です。

Base64を賢く使う

Base64はテキストのみのAPI、小さな埋め込みアセット、テストフィクスチャ、ポータブルドキュメントに最適です。ペイロードサイズが増えるため、大きな公開アセットには外部ファイルが通常より適しています。

よくある質問

画像をcss base64に変換はプライベートですか?

はい。小さな画像をインライン化するとネットワークリクエストを減らせますが、大きなアセットは通常キャッシュファイルとして扱う方が適しています。 すべての処理はブラウザ内でローカルに行われ、サーバーにはアップロードされません。

どのような CSS 出力が生成されますか?

Data URL を含む background-image 宣言で、スタイルシートのクラスルールに貼り付けられます。

大きなヒーロー画像を Base64 でインライン化すべきですか?

通常はいいえ。大きな画像は CSS を肥大化させ、個別にキャッシュできません。アイコンなど小さな UI アセットのみインライン化してください。

CSS背景画像にBase64をいつ使うべきですか?

テキストのみのチャネルやAPIでバイナリデータを運ぶ必要がある場合、または小さなCSS背景画像アセットを自己完結型ドキュメント内に含める必要がある場合に使用します。大きなキャッシュ可能な公開アセットには別ファイルが望ましいです。

その他のBase64ツールを見る