Category
Archives
Cocotiie
Trial And Error!やってみよう!の精神でWeb制作をしています。初心者の方にも伝わるよう、心がけています。少しでも誰かの助けになれれば嬉しいです。宜しくお願い致します。

2006年:Web制作に関する覚書きブログをはじめる。

2018年:Cocotiie(ココッティー)として運営開始。
テーマをSWELLにしてリニューアルしましたSWELLについて

おしゃれなダミー画像 Lorem Picsum

Lorem Picsum

サイト制作で、とりあえず画像を入れたい。でも見栄えも拘りたい。
いちいちダウンロードしてトリミングするのは面倒ですよね。URLを書くだけで好きなサイズ、ぼかし、白黒など加工も要らない便利なサイトをご紹介します。とっても便利で無料です。

使い方は難しくありません。サイトに書いてある通りですが、まとめました。

INDEX

基本形

縦/横サイズ と 正方形 ※アクセスする度にランダムに表示されます。

https://picsum.photos/200/300
https://picsum.photos/200

ランダム表示 いろいろ

複数枚表示したいが、同じ写真にならない様にしたい。サイズ/?random=数字

<img src="https://picsum.photos/200?random=1">
<img src="https://picsum.photos/200?random=2">

画像の指定をしないが・・同じ画像

画像の指定はしないが、読み込む時は毎回同じ画像を表示する

<img src="https://picsum.photos/seed/picsum/200">

特定の1枚

写真を選びIDを付け足します。/di/写真番号/縦/横

https://picsum.photos/id/1003/200/300

エフェクト

白黒(グレースケール)

https://picsum.photos/200/300?grayscale

ぼかし

ボカシ加減が設定する際は、?blur=数値 1~10を付け足します。

https://picsum.photos/200/300/?blur
https://picsum.photos/200/300/?blur=2

白黒+ぼかし

https://picsum.photos/id/870/200/300?grayscale&blur=2

画像フォーマット(拡張子指定)

jpg、webpを指定する事が出来ます。

https://picsum.photos/200/300.jpg
https://picsum.photos/200/300.webp

\この記事がお役にたったら/

広告を減らしサイトを見やすくする予定です

cocotiieの運営をサポートして頂ければ嬉しいです

「金額を入力」で1円から入力できます

よかったらシェアお願いします
  • URLをコピーしました!
  • URLをコピーしました!

コメント ※ハンドルネームでお願いします

コメントする

INDEX