FimgFlare (Fake Image on Cloudflare)

簡介

以在CDN原生直接運行的條件下，重新復刻 Fake images please? 的原有功能。在設計網站時，在已知尺寸的情況下，可快速插入預留圖可以幫助您排版。

並在原有的網址結構基礎下，加入分組式的網址結構，預留未來加入其他內容類型的彈性。

同時也新增邊緣背景設計的功能，方便用於製作螢幕截圖示意圖、簡報圖美化用途。

如何使用

網址結構

https://fimg.yuaner.tw/[canvas-size]/bg/[bg-padding]/[bg-shadow]/[bg-radius]/[bg-bgcolor]/ph/[bgcolor]/[fgcolor]/?text=[text]&filetype=[svg|png]

常用範例

<h3>一般預留圖</h3>
<img src="https://fimg.yuaner.tw/300x200.svg">

<h3>自訂文案預留圖</h3>
<img src="https://fimg.yuaner.tw/400x200?text=🖼️預留圖😉&filetype=png">

<h3>自訂背景色與文字顏色的預留圖</h3>
<img src="https://fimg.yuaner.tw/400x200/ff0000/FFF/?text=I am red.">

<h3>帶有帶有陰影的透明邊緣的預留圖 (bg=Background ph=PlaceHolder)</h3>
<img src="https://fimg.yuaner.tw/300x200/bg/5/10/ph.svg">

<h3>帶有帶有圓角陰影的圖案邊緣的預留圖</h3>
<img src="https://fimg.yuaner.tw/300x200/bg/5/10/4/tpl(drool)/ph.svg">

相容 Fake images please? 用法範例

  • https://fimg.yuaner.tw/300/
  • https://fimg.yuaner.tw/250x100/
  • https://fimg.yuaner.tw/250x100/ff0000/
  • https://fimg.yuaner.tw/350x200/ff0000/000
  • https://fimg.yuaner.tw/350x200/ff0000,128/000,255
  • https://fimg.yuaner.tw/350x200/?text=Hello
  • https://fimg.yuaner.tw/200x100/?retina=1&text=こんにちは&font=noto
  • https://fimg.yuaner.tw/350x200/?text=World&font=lobster
  • https://fimg.yuaner.tw/440x230/ff0000,128/000,255/?retina=1&text=Problem?%20%3C%3Apepw%3A989410572514758676%3E
fakeimg.pl
fakeimg.pl
fakeimg.pl
fakeimg.pl