Help Center

Base64 Preview

3 分で読めます

Base64 Preview

このアプリは、Base64エンコードされた文字列を入力し、画像、音声、動画、PDFファイルをプレビューするのシンプルなウェブアプリケーションです。クエリパラメータを用いてURLからデータを取得することもできます。

機能

  • Base64エンコードされた画像、音声、動画、PDFのプレビュー
  • クエリパラメータから自動的にデータを取得
  • クリップボードからのデータの貼り付け
  • テキストファイルからのデータの読み込み

使用方法

  1. index.htmlを開く。 ローカルにダウンロードすることで、オフラインでも実行できる。
  2. Base64データを入力：以下のいずれかの方法でBase64デコードされたテキストを入力する。 Base64エンコードされた文字列を直接テキストエリアに入力する。 「クリップボードから貼り付け」ボタンをクリックすると、クリップボードにコピーされたテキストが貼り付けられる 「ファイルを選択」からテキストファイル(拡張子が.txtである必要があります。)をアップロードする。 テキストファイル（拡張子が.txtである必要があります。）がアップロードされているURLを下のテキストエリア入力する。
  3. 正常にデータが読み込まれると、テキストエリアの上部にプレビューが表示される

アセット

assetsディレクトリに収録されているデータのURL、およびデータの出典

    <div style="height: 200px; width: 100%; border-bottom: 1px solid #f1f5f9; background-color: #f8fafc; overflow: hidden;">
        <img src="https://s.wordpress.com/mshots/v1/https%3A%2F%2Fbrand.github.com%2Ffoundations%2Flogo?w=800" style="width: 100%; height: 100%; object-fit: cover; border: none;" alt="Thumbnail" onerror="this.style.display='none'">
    </div>
    <div style="padding: 16px;">
        <div style="display: flex; align-items: center; gap: 8px; margin-bottom: 8px;">
            <img src="https://www.google.com/s2/favicons?domain=brand.github.com" style="width: 16px; height: 16px; border-radius: 2px;" alt="favicon" onerror="this.style.display='none'">
            <span style="font-size: 0.75em; color: #64748b; font-weight: 600; text-transform: uppercase; letter-spacing: 0.05em; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;">github.com</span>
        </div>
        <h3 style="margin: 0 0 10px 0; font-size: 1.1em; color: #0f172a; line-height: 1.4; font-weight: 700;">Logo - Brand Toolkit</h3>
        
    </div>
</a>

Footnotes

  1. (author:: github.com). “(title:: Logo - Brand Toolkit)“. (link:: https://brand.github.com/foundations/logo), (access-date:: 2026-06-18 22:36:51). ↩

0件のページ