Softonic

Lorem Picsum ギャラリー

ステップ 1 / 2
次へ

Lorem Picsumは、シンプルなURL API（https://picsum.photos/{width}/{height}）を通じてロイヤリティフリーの写真を提供します。任意のサイズの画像が返されます。このギャラリーでは幅、高さ、シード、ぼかし半径、グレースケールを設定でき、そのまま貼り付けられるURL（または<img>タグ）をコピーできます。ストック写真を探し回ることなく、写真のプレースホルダーをFigmaやBladeビュー、Reactコンポーネントに直接差し込めます。

ギャラリーの使い方

  1. 1

    画像サイズを設定する

    幅と高さをピクセルで指定します。800×600や1200×630といった一般的なサイズはプリセットとして用意されています。

  2. 2

    修飾子を選ぶ

    ぼかし（0〜10）、グレースケール、再現可能な画像のための固定シード、WebPまたはJPEG形式。

  3. 3

    プレビューグリッドを見る

    複数のランダムなサンプルが読み込まれるので、気に入ったものを選べます。

  4. 4

    URLをコピーする

    そのままのURL、完全な`<img>`タグ、またはMarkdownの画像記法を取得できます。

URLの構造

ベースエンドポイント：

https://picsum.photos/{width}/{height}

これに、任意のクエリやパスの要素を追加できます：

バリアント 例 効果
正方形のショートカット /200 → /200/200と同じ 正方形の画像
固定シード /seed/cat/400/300 常に同じ写真を返す
特定の写真ID /id/237/400/300 コレクション内の画像237に固定する
グレースケール /400/300?grayscale モノクロフィルター
ぼかし /400/300?blur=5 ガウスぼかし、1〜10
フォーマット /400/300.webp ファイル形式を強制する
読み込みごとにランダム URLのみ 更新のたびに新しい写真

本物のストック写真とどう使い分けるか

  • 向いている用途： ワイヤーフレーム、デザインレビュー、社内デモ、テスト用データ、遅延読み込み（レイジーロード）の検証。
  • 向いていない用途： 本番のマーケティングサイト、ヒーロー画像、SNS用のプレビュー画像。実トラフィックのために他者の無料画像サービスへ直接リンクするのはマナー違反であり、不安定でもあります。写真は予告なく変わる可能性があります。

ヒント

  • シードを固定 してから、ドキュメント用にデザインのスクリーンショットを撮りましょう。そうしないと、次に誰かがページを開いたときに画像が変わってしまいます。
  • 最終アセットのアスペクト比（16:9、4:5、1:1）に合わせておくと、本物の写真に差し替えてもレイアウトが崩れません。
  • プレースホルダーから本画像への遷移をテストするにはぼかしを使いましょう（LQIPパターン）。Picsumのぼかし出力は、低品質画像のプレースホルダーの見え方を再現します。
  • 開発中はページを軽くするために WebPをリクエスト しましょう。

よくある質問

技術的にはこれらの写真はUnsplashライセンスですが、本番環境からpicsum.photosへホットリンクすることは推奨されません。プロトタイプ用途にとどめ、本番で使う場合はアセットをダウンロードするか、元のUnsplashのソースを利用してください。

シードやIDを指定しないと、APIはリクエストごとにランダムな写真を返します。固定するには/seed/tango/...または/id/123/...を使ってください。

Lorem PicsumはCloudflare上で提供される無料サービスで、妥当なレート制限があります。大規模なテストスイートや負荷テストの場合は、ローカルにコピーをダウンロードし、自分のホストから配信してください。

はい。このサービスはHTTPS専用です。生成されるURLはすべてhttps://で始まります。

プレビューのサムネイルのみで、これらはpicsum.photosから直接読み込まれます。このギャラリー自体が、あなたのサイズやシードの選択に関するデータを第三者に送信することはありません。

関連ツール

ASCII表リファレンス

0から127までの完全なASCII表です。NUL、LF、DELなどの制御コードを含め、各文字の10進数、16進数、8進数、2進数、HTML数値文字参照を表示します。

HTML文字参照

HTMLエンティティの検索可能なリスト、その名称コードおよび数値コード、および特殊文字や記号のワンクリックコピー機能を提供します。

キーボードショートカット一覧

macOS、Windows、Linux向けに、VS Code、Chrome、GNU Readlineを使うBashの公式資料に基づく既定ショートカットを検索できます。

JavaScript圧縮ツール

変数名のリネーム、空白の削除、デッドコードの除去、定数畳み込みでJavaScriptを圧縮し、より小さなバンドルを作成します。

メールアドレス検証ツール

メールアドレスを検証します。RFC 5322構文チェック、MXレコードのライブ確認に加え、ローカル部、ドメイン、長さの詳細を表示します。メールは送信されません。

EditorConfig ジェネレーター

インデントのスタイルとサイズ、改行コード、文字コード、空白ルールを指定して .editorconfig ファイルを生成し、IDE やエディタをまたいで書式を統一できます。

このツールは他の言語でも利用できます