menu 首頁
menu 隱形圖片
說明
說明：處理後的圖片，在白色的背景的網頁會完全隱形，只有在黑色背景的地方才看得到。
原理：使用單一顏色，不同透明度來繪製圖片。
原理：使用單一顏色，不同透明度來繪製圖片。
匯入圖片
選擇一張圖片
載入圖片 image
設定
輸出
嘗試拖曳滑桿，觀看圖片在黑色與白色的地方呈現的效果
![]()
下載圖片 cloud_download
如果無法順利下載圖片，請手動儲存圖片
電腦：對圖片「右鍵」→另存圖片
手機：對圖片「長按」→下載圖片
| brightness_high |
|
brightness_2 |
下載圖片 cloud_download
如果無法順利下載圖片，請手動儲存圖片
電腦：對圖片「右鍵」→另存圖片
手機：對圖片「長按」→下載圖片
menu 偽裝圖片
說明
說明：利用隱形圖片的技術重疊兩張圖片，在黑色與白色的地方，會分別看到兩種不同的圖片
匯入圖片
圖１：白色時才會顯示出來的圖片
載入圖片 image
圖２：黑色時才會顯示出來的圖片
載入圖片 image
設定 (查看設定技巧)
設定技巧
如果圖片一張很大，一張很小
可以利用「限制圖片最大寬度」來解決
例如：一張圖寬度有2000，另一張只有300
那麼就把寬度限制設定成300
如果合成出來後，感覺在白底的清晰度不夠
可以嘗試調整填充顏色的透明度
rgba 最後的 a 就是透明度，值介於 0~1
也可以利用「反轉填充」來讓圖片有類似「負片」的效果
對於一些很亮或是很暗的圖片特別有效
像是可以設定成這樣(不見得適用於所有圖片)
| 圖片貼齊 |
|
| 限制圖片 最大寬度 |
|
| 填充顏色 |
|
| 圖１： 反轉填充 |
|
| 圖２： 反轉填充 |
|
產生圖片 done
輸出
嘗試拖曳滑桿，觀看圖片在黑色與白色的地方呈現的效果
![]()
下載圖片 cloud_download
如果無法順利下載圖片，請手動儲存圖片
電腦：對圖片「右鍵」→另存圖片
手機：對圖片「長按」→下載圖片
| brightness_high |
|
brightness_2 |
下載圖片 cloud_download
如果無法順利下載圖片，請手動儲存圖片
電腦：對圖片「右鍵」→另存圖片
手機：對圖片「長按」→下載圖片
menu 作者
作者
menu 關於
關於
隱形圖片 產生器
本版資訊：
2.0.1
本專案包含以下套件：
Materialize： 一套符合 Material Design 設計 的網頁前端框架。
noUiSlider： 一個輕量級JavaScript範圍滑塊
jQuery： 一套跨瀏覽器的JavaScript函式庫，簡化HTML與JavaScript之間的操作。
jQuery MiniColors： 一個基於jQuery的 顏色選擇器
menu 其他作品
其他作品
456+