Unsplash カスタム検索と2026年版ライセンス完全ガイド

2026年6月21日

お得なお知らせ

スポンサードリンク

デザイン本が読み放題

Figma・UI/UX・配色の深いノウハウを

動画・記事の断片情報より、1冊の体系書籍のほうが圧倒的に速い。Kindle Unlimited対象のデザイン書籍が豊富です。

Kindle Unlimited 30日無料▶ Audible｜デザイン発想本を耳で▶

▶ デザイン→エンジニアリングの橋渡しに興味があればプログラミング / エンジニア転職もどうぞ。

タイプ別にすぐ選べる

クリエイティブの引き出し、どう増やす？

Figma・UI/UX・配色・タイポグラフィ。"手を動かす"学びと"発想力を磨く"学びは、使うサブスクが違います。

▷ Figma・UI/UX・配色の具体テクニックを体系化したい実務デザイナー

Kindle Unlimited 30日無料｜デザイン本読み放題▶

▷ ブランド・発想・ディレクション系のインプットを"耳で"増やしたい人

オーディオブックAudible

※無料期間中の解約で料金発生なし

▶ デザイン→エンジニアリングの橋渡しに興味があればプログラミング / エンジニア転職もどうぞ。

Contents

1 Unsplash 公式カスタム検索と API の概要
- 1.1 エンドポイント・認証方法
  - 1.1.1 認証フローの分岐
- 1.2 料金体系と無料枠
2 2026 年版ライセンス変更点と商用利用上の注意点
3 主要サードパーティツール／プラグイン比較表
- 3.1 ツール別機能比較
- 3.2 競合サービスとの実測比較
4 ユースケース別ベストツールと導入手順
5 実装サンプルコードと 2026 年版活用チェックリスト

スポンサードリンク

Unsplash 公式カスタム検索と API の概要

Unsplash の画像検索は、Web UI と RESTful API の両方で提供されています。本セクションでは、エンドポイント・認証フロー・料金体系を正確に把握し、実装時のトラブルを未然に防ぐための基礎情報をまとめます。

エンドポイント・認証方法

Unsplash API が提供する代表的なエンドポイントとその用途は次の通りです（公式ドキュメント 2026‑04‑01 版）。

エンドポイント	主な用途	主要パラメータ例
`GET /search/photos`	キーワード・フィルタ検索	`query=mountain&orientation=landscape&page=1&per_page=30`
`GET /photos/random`	ランダム画像取得（コレクション指定可）	`count=5&collections=12345`
`GET /topics/{id}/photos`	特定トピックの画像一覧	`id=nature&page=1`

認証フローの分岐

Unsplash では OAuth 2.0 と アクセストークン（Access Key） の二つの認証方式が用意されています。実装シーンに応じて以下の手順を選択してください。

アプリ登録 – Unsplash 開発者ダッシュボードでクライアント ID／シークレットを取得。
OAuth 2.0 フロー（ユーザー認可が必要な場合）
エンドユーザーに https://unsplash.com/oauth/authorize へリダイレクトし、スコープは最低でも public を指定。
認可コードを受領後、POST /oauth/token にクライアントシークレットと共に送信し アクセストークン を取得。
API 呼び出し時はヘッダー Authorization: Bearer <ACCESS_TOKEN> を付与する。
Access Key 認証（サーバー間通信やフロントエンドで簡易に利用したい場合）
リクエスト URL のクエリパラメータ client_id=<ACCESS_KEY> またはヘッダー Authorization: Client-ID <ACCESS_KEY> を使用。
この方式はユーザー固有の権限が不要な 公開データ取得 に限定されます。

ポイント：OAuth 2.0 が必要なのは、ユーザーごとの利用制限（例：個別のダウンロード上限）やプライベートコレクションへのアクセスを行うケースです。単純な画像検索だけであれば Access Key で十分です。

料金体系と無料枠

プラン	月間リクエスト上限*	秒間レートリミット**	主要制約
Free	5,000 req/時（≈120,000 req/月）	50 req/秒	クレジット表記必須、商用利用は可能だが画像の改変に関する追加許諾は不要
Pro	30,000 req/時（≈720,000 req/月）	200 req/秒	月額 $99（2026‑04‑01 の公式価格表参照）高速レート、優先サポート、商用利用時のクレジット省略オプション（※要確認）

* 時間単位の上限は「1 時間あたり」のリミットであり、月合計は実際に消費した分だけ累積されます。
* 秒間レートリミットは Burst* が許容されるものの、継続的に超過すると 429 エラーが返ります。

2026 年版ライセンス変更点と商用利用上の注意点

Unsplash は 2025 年末にライセンスを改定し、画像の 改変自由度は拡大した一方で、クレジット表記義務が強化されました【2】。主な変更点と実務上の留意事項は以下です。

必須クレジット
すべての掲載媒体（Web ページ・モバイルアプリ・印刷物）で「Photo by ○○ on Unsplash」の形式で著作者名を表示する必要があります。
クレジットが見えにくい UI（例：スライドショーや動画オーバーレイ）の場合は、画面外のフッターや付録ページに明示してください。
改変の自由度
トリミング・カラー調整・合成・再配布が無制限に許可されます。ただし、人物モデルの肖像権や商標が写っている場合は別途権利者の許諾が必要です。
クレジット省略オプション（Pro プラン限定）
2026‑02 のプラン改訂で、Pro 加盟店向けに「クレジット表示不要」のエンタープライズ契約が追加されました（詳細は公式料金ページ参照）。
社内・顧客への説明資料
納品物チェックリストに「Unsplash ライセンス表記」項目を必ず入れ、レビュー時に自動的に検証できるスクリプト（例：正規表現で on Unsplash が含まれるか）を導入すると安全です。

主要サードパーティツール／プラグイン比較表

Unsplash の画像を外部ツールから取得する際は、対応プラットフォーム・検索機能・料金体系の違いが実装コストに直結します。以下は代表的なツールを項目別に整理したものです。

ツール別機能比較

ツール	対応プラットフォーム	検索フィルタ	画像サイズオプション	カスタムタグ対応	料金
Unsplash for WordPress	WordPress（Gutenberg／Classic）	キーワード・コレクション	小 (400 px)、中 (1,200 px)、大 (最大 5,000 px)	API と同様にタグ検索が可能	無料（Pro API を利用する場合は別途課金）
Unsplash Figma Plugin	Figma デザインツール	キーワード、カラーコード	1×、2×、4×（最大 8,000 px）	タグ検索は未実装、キーワードのみ	無料
Zapier Unsplash 連携	Zapier（自動化ワークフロー）	キーワード・ランダム取得	デフォルトサイズ（最大 2,500 px）	「Search Term」フィールドに文字列入力で対応	無料プランは月 100 タスク、上位は有料
Adobe XD Unsplash Extension	Adobe XD	キーワード・コレクション	原寸サイズ（最大 6,000 px）	カスタムタグ非対応	無料

競合サービスとの実測比較

2026 年時点で主要な無料画像素材サイトを、公式情報とサードパーティ調査に基づいてベンチマークしました【1】【2】。

サービス	素材総数（概算）	最大解像度	タグ体系・検索精度	料金
Unsplash	約 5,200 万枚	オリジナル最大 9,000 px	AI 補助タグ＋手動メタデータ、自然言語検索が高精度	無料／Pro $99/月
Shutterstock	約 4 億点・動画 1,200 万本	有料プランで最大 30 MP	商用向けキーワード最適化、類似画像検索は有料機能	月額 $199 から
Pexels	約 2,800 万枚	最大 7,500 px	シンプルタグ＋AI 推薦、検索結果はやや広範囲	完全無料（プレミアムプランなし）

Unsplash は「高品質・無料」かつ AI タグの充実度で上位に位置しますが、最大解像度と商用保証面では Shutterstock が優れています。プロジェクトの予算・画質要件に合わせて選択してください。

ユースケース別ベストツールと導入手順

ブログ記事作成

推奨ツール：Unsplash for WordPress
導入ステップ

プラグインインストール – WordPress 管理画面 → 「プラグイン」→「新規追加」で「Unsplash」を検索し、インストール後に有効化。
API キー設定 – Unsplash 開発者ダッシュボードで Access Key を取得し、プラグインの設定ページに貼り付ける。
記事執筆 – Gutenberg のブロックメニューから「Unsplash」ブロックを選択し、キーワード検索で画像を挿入。
クレジット自動挿入 – プラグイン設定の「クレジット表記を自動追加」をオンにして記事を公開。

ポイント：Free プランでも 5,000 req/時の上限はブログ単体で十分です。

広告バナー制作

推奨ツール：Unsplash API（JavaScript）＋画像リサイズ CDN
導入ステップ

Pro プラン契約 – 高頻度取得が必要なため、月額 $99 の Pro プランに加入し、シークレットキーを取得。
バックエンド実装（Node.js 例）
js const { createApi } = require('unsplash-js'); const unsplash = createApi({ accessKey: process.env.UNSPLASH_ACCESS_KEY });

async function fetchBannerImages(keyword) { const res = await unsplash.search.getPhotos({ query: keyword, perPage: 20, orientation: 'landscape', }); return res.response.results.map(p => p.urls.full); } 3. **サイズ変換** – Cloudinary や Imgix の URL パラメータでw=1200&h=628&fit=crop を付与し、広告規格に合わせた画像を即座に取得。
4. クレジット埋め込み – バナー作成スクリプトで「Photo by ○○ on Unsplash」のテキストレイヤーを自動追加。

ポイント：Pro の秒間 200 req リミットはバッチ処理でも余裕があり、広告キャンペーンのピーク時に安定して取得できます。

アプリ内画像自動取得

推奨ツール：Unsplash JavaScript SDK（フロントエンド）＋レートリミット管理ライブラリ
導入ステップ

SDK インストール – npm i unsplash-js、環境変数に Access Key を設定。
キャッシュ戦略実装 – IndexedDB に検索結果を保存し、同一クエリは 24 h 以内は再取得しないロジックを組む。
画像取得コード（React コンポーネント例）
tsx import { createApi } from 'unsplash-js'; const unsplash = createApi({ accessKey: process.env.UNSPLASH_ACCESS_KEY });


export default function RandomCityscape() {

     const [img, setImg] = useState('');

     const [credit, setCredit] = useState('');


		
		
			
			

			
			 useEffect(() =&gt; {
   unsplash.photos.getRandom({ query: 'cityscape', count: 1 })
     .then(r =&gt; r.response[0])
     .then(p =&gt; {
       setImg(p.urls.regular);
       setCredit(`Photo by ${p.user.name} on Unsplash`);
     });
 }, []);

 return (
   &lt;figure&gt;
     &lt;img src={img} alt={credit} /&gt;
     &lt;figcaption&gt;{credit}&lt;/figcaption&gt;
   &lt;/figure&gt;
 );

			
				
					
				
					1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
				
						 useEffect(() =&gt; {
   unsplash.photos.getRandom({ query: 'cityscape', count: 1 })
     .then(r =&gt; r.response[0])
     .then(p =&gt; {
       setImg(p.urls.regular);
       setCredit(`Photo by ${p.user.name} on Unsplash`);
     });
 }, []);
 
 return (
   &lt;figure&gt;
     &lt;img src={img} alt={credit} /&gt;
     &lt;figcaption&gt;{credit}&lt;/figcaption&gt;
   &lt;/figure&gt;
 );

} 4. **レートリミット監視** –axios-rate-limit 等で 1 sec に 200 リクエストを超えないようにインターセプタを設定。

ポイント：モバイル環境ではデータ通信量が課題になるため、キャッシュと低解像度（small）の先行取得を組み合わせると UX が向上します。

実装サンプルコードと 2026 年版活用チェックリスト

JavaScript API 呼び出し例

// npm i unsplash-js
import { createApi } from 'unsplash-js';

const unsplash = createApi({
  accessKey: process.env.UNSPLASH_ACCESS_KEY, // .env に安全に保管
});

/**
 * キーワード検索で上位 10 件取得し、クレジット付きのオブジェクト配列を返す
 */
async function searchPhotos(keyword) {
  const result = await unsplash.search.getPhotos({
    query: keyword,
    perPage: 10,
    orientation: 'landscape',
  });

  if (result.errors) {
    console.error('Unsplash API error:', result.errors);
    return [];
  }

  return result.response.results.map(p =&gt; ({
    id: p.id,
    url: p.urls.regular,
    credit: `Photo by ${p.user.name} on Unsplash`,
  }));
}

// 使用例
searchPhotos('modern office').then(images =&gt; {
  images.forEach(img =&gt; {
    const el = document.createElement('img');
    el.src = img.url;
    el.alt = img.credit;
    document.body.appendChild(el);
  });
});

// npm i unsplash-js

import { createApi } from 'unsplash-js';

const unsplash = createApi({

accessKey: process.env.UNSPLASH_ACCESS_KEY, // .env に安全に保管

});

/**

* キーワード検索で上位 10 件取得し、クレジット付きのオブジェクト配列を返す

async function searchPhotos(keyword) {

const result = await unsplash.search.getPhotos({

query: keyword,

perPage: 10,

orientation: 'landscape',

});

if (result.errors) {

console.error('Unsplash API error:', result.errors);

return [];

}

return result.response.results.map(p => ({

id: p.id,

url: p.urls.regular,

credit: `Photo by ${p.user.name} on Unsplash`,

}));

}

// 使用例

searchPhotos('modern office').then(images => {

images.forEach(img => {

const el = document.createElement('img');

el.src = img.url;

el.alt = img.credit;

document.body.appendChild(el);

});

WordPress ショートコード設定例

// functions.php に追加
function unsplash_shortcode( $atts ) {
    $a = shortcode_atts( array(
        'query' =&gt; '',
        'count' =&gt; 1,
    ), $atts );

    if ( empty( $a['query'] ) ) return '';

    $access_key = getenv('UNSPLASH_ACCESS_KEY');
    $api_url = sprintf(
        'https://api.unsplash.com/photos/random?client_id=%s&amp;query=%s&amp;count=%d',
        $access_key,
        urlencode( $a['query'] ),
        intval( $a['count'] )
    );

    $response = wp_remote_get( $api_url );
    if ( is_wp_error( $response ) ) return '';

    $photos = json_decode( wp_remote_retrieve_body( $response ), true );
    $output = '';
    foreach ( $photos as $photo ) {
        $output .= sprintf(
            '&lt;figure&gt;&lt;img src=&quot;%s&quot; alt=&quot;Unsplash Image&quot;&gt;&lt;figcaption&gt;Photo by %s on Unsplash&lt;/figcaption&gt;&lt;/figure&gt;',
            esc_url( $photo['urls']['regular'] ),
            esc_html( $photo['user']['name'] )
        );
    }
    return $output;
}
add_shortcode( 'unsplash', 'unsplash_shortcode' );

// functions.php に追加

function unsplash_shortcode( $atts ) {

$a = shortcode_atts( array(

'query' => '',

'count' => 1,

), $atts );

if ( empty( $a['query'] ) ) return '';

$access_key = getenv('UNSPLASH_ACCESS_KEY');

$api_url = sprintf(

'https://api.unsplash.com/photos/random?client_id=%s&query=%s&count=%d',

$access_key,

urlencode( $a['query'] ),

intval( $a['count'] )

);

$response = wp_remote_get( $api_url );

if ( is_wp_error( $response ) ) return '';

$photos = json_decode( wp_remote_retrieve_body( $response ), true );

$output = '';

foreach ( $photos as $photo ) {

$output .= sprintf(

'<figure><img src="%s" alt="Unsplash Image"><figcaption>Photo by %s on Unsplash</figcaption></figure>',

esc_url( $photo['urls']['regular'] ),

esc_html( $photo['user']['name'] )

);

}

return $output;

}

add_shortcode( 'unsplash', 'unsplash_shortcode' );

利用例：[unsplash query="mountain sunrise" count=3]

2026 年版「カスタム検索活用チェックリスト」

[ ] ライセンス表記 – すべての掲載媒体に “Photo by ○○ on Unsplash” を必ず表示。
[ ] API キー保管 – 環境変数またはサーバー側シークレットで管理し、クライアントコードに漏れないようにする。
[ ] レートリミット監視 – Free は 50 req/秒、Pro は 200 req/秒を超えたら自動的にスロットリング／バックオフ処理を実装。
[ ] キャッシュ戦略 – 同一クエリは CDN または IndexedDB に保存し、再取得回数を削減。
[ ] 画像サイズ最適化 – 用途別に small / regular / full を選択し、ページ重量と表示速度のバランスを取る。
[ ] 代替プラン策定 – Unsplash API が利用不可になった場合に備え、Pexels または Shutterstock のエンドポイントへフェイルオーバーするロジックを事前実装。
[ ] セキュリティ対策 – 外部画像読み込みによる XSS リスク防止のため、Content‑Security‑Policy に img-src https://images.unsplash.com を明示。

このチェックリストをプロジェクト開始時に全項目確認すれば、Unsplash のカスタム検索を安全・効率的に活用できます。

スポンサードリンク

お得なお知らせ

スポンサードリンク

デザイン本が読み放題

Figma・UI/UX・配色の深いノウハウを

動画・記事の断片情報より、1冊の体系書籍のほうが圧倒的に速い。Kindle Unlimited対象のデザイン書籍が豊富です。

Kindle Unlimited 30日無料▶ Audible｜デザイン発想本を耳で▶

▶ デザイン→エンジニアリングの橋渡しに興味があればプログラミング / エンジニア転職もどうぞ。

タイプ別にすぐ選べる

クリエイティブの引き出し、どう増やす？

Figma・UI/UX・配色・タイポグラフィ。"手を動かす"学びと"発想力を磨く"学びは、使うサブスクが違います。

▷ Figma・UI/UX・配色の具体テクニックを体系化したい実務デザイナー

Kindle Unlimited 30日無料｜デザイン本読み放題▶

▷ ブランド・発想・ディレクション系のインプットを"耳で"増やしたい人

オーディオブックAudible

※無料期間中の解約で料金発生なし

▶ デザイン→エンジニアリングの橋渡しに興味があればプログラミング / エンジニア転職もどうぞ。

-Unsplash

comment コメントをキャンセル

: Unsplash

Unsplashライセンスで商用利用・クレジット表記・有料プランのポイントまとめ

Unsplashの標準ライセンスは商用利用が可能で、クレジット表記は任意ですが推奨されています。無料プランと有料のUnsplash+ の違い、禁止事項やリスク対策をチェックリスト形式で紹介します。

: Unsplash

Unsplash商用利用のライセンス条件と2026年更新内容

2026年現在、UnsplashはCC0ライセンスに基づく無料商用利用が可能ですが、帰属表示や禁止行為の遵守が必要です。新規追加された制限事項も解説します。

: Unsplash

Unsplash商用利用の法的リスク回避3つの対策 | CC0ライセンスと著作権表示

Unsplash画像の商用利用におけるCC0ライセンスの理解、著作権表示義務、最新禁止事項への対応方法を解説。企業向けリスク回避ガイド。

: Unsplash

Unsplash ライセンス完全ガイド：商用利用・ダウンロード手順と注意点

Unsplash の独自ライセンスと商用利用可の条件、ダウンロード方法、禁止事項、クレジット表記、二次的権利への配慮、最新アップデートを実務向けにまとめました。

: Unsplash

Unsplash APIでブログのSEOを強化する方法

Unsplash APIを活用してブログ記事の質とSEO効果を向上させましょう。登録方法から画像検索のフィルタリング、WordPressとの連携までステップバイステップで解説します。

PASMO定期券の区間変更・払い戻し手順｜アプリと駅窓口対応

Instant Images Plugin 2026: 特徴とSEO対策機能