最近在測試一些前端的東西,我需要用戶的 avatar ,所以我的需求是
透過網址就直接能夠生出一張可愛或是勘看的圖片,所以網路上找一下,因為都是要自己手動生成
所以我把一些找到的整理一下
最大只有到 1000px ,使用方式也很簡單 https://i.pravatar.cc/[email protected] 後面的 u 帶入一個 uuid 就可以了
這樣就可以簡單產生用戶的 avatar
sample:
https://i.pravatar.cc/[email protected]
這裡面提供不少,這邊我簡單說幾種,也方便之後我要用到直接 CP
2.1 怪獸類 ,範例網址 : https://robohash.org/[email protected]?set=set2&bgset=&size=400x400
[email protected] 就是你可以輸入的變數,然後尺寸就是後面的 size=400x40
範例圖片: https://robohash.org/[email protected]?set=set2&bgset=&size=400x400
2.2 貓咪類,範例網址:https://robohash.org/[email protected]?set=set4&bgset=&size=200x200
[email protected] 就是你可以輸入的變數,然後尺寸就是後面的 size=200x200,跟怪獸的差異在 set 變成 set4
範例圖片: https://robohash.org/[email protected]?set=set4&bgset=&size=200x200
2.3 機器人類,範例網址:https://robohash.org/[email protected]?set=set1&bgset=&size=200x200
[email protected] 就是你可以輸入的變數,然後尺寸就是後面的 size=200x200,跟怪獸的差異在 set 變成 set1
範例圖片: https://robohash.org/[email protected]?set=set1&bgset=&size=200x200
這個主要比較偏向八進位風格的圖片,它的特色是 .svg 圖片
3.1 女生,範例網址 : https://avatars.dicebear.com/v2/female/[email protected]
其中也很簡單,把 [email protected] 換成你要的 uuid 即可
範例圖片: https://avatars.dicebear.com/v2/female/[email protected]
3.2 男生,範例網址: https://avatars.dicebear.com/v2/male/[email protected]
其中網址部份把 female 改成 male 之後也是將 [email protected] 換成你要的 uuid 即可
範例圖片: https://avatars.dicebear.com/v2/male/[email protected]
3.3 幾何圖形,範例網址: https://avatars.dicebear.com/v2/jdenticon/[email protected]
範例圖片: https://avatars.dicebear.com/v2/jdenticon/[email protected]
其實他還很多類型,我只是列出我可能比較會用到的
這個方便的是,可以產生你要的文字還可以指定字型,但是如果是中文記得字形要指定成 noto
範例網址: https://fakeimg.pl/400x200/?text=當麻許&font=noto
有了這些,有時候再作範例的時候就會很方便
reference :
https://vinicius73.github.io/gravatar-url-generator/#/