iT邦幫忙

0

在HTML上調配cmyk的方法

  • 分享至 

  • xImage

如標題,試問要如何在HTML調配cmyk,cmyk調配數值範圍只有0~20
(已知網頁呈現只能用rgb表示,是否有方法可以讓後端去換算後再呈現出來?)
而這些cmyk資料是要連接到資料庫的,試問網頁用DW寫的話,資料庫要用哪種適合?
還有要自己寫出這種後端顏色庫需要找哪些相關資料?
這陣子找了很多但找到的都是該軟體就有內建的調色盤,跟我需要的不一樣..

求大師指點~已經找了一星期都沒有找到真正府合需求的
(若表達不佳可再詳述)

看更多先前的討論...收起先前的討論...
淺水員 iT邦大師 6 級 ‧ 2021-03-24 01:24:15 檢舉
為什麼要用cmyk?
0805cyc iT邦新手 4 級 ‧ 2021-03-24 01:30:47 檢舉
因為要做皮包網站 皮包的染料是用cmyk去調配的
ccutmis iT邦高手 2 級 ‧ 2021-03-24 06:15:06 檢舉
https://www.qtccolor.com/findColor.aspx
froce iT邦大師 1 級 ‧ 2021-03-24 08:04:04 檢舉
https://www.rapidtables.com/convert/color/cmyk-to-rgb.html

R = 255 × (1-C) × (1-K)
G = 255 × (1-M) × (1-K)
B = 255 × (1-Y) × (1-K)

簡單算術自己寫一下就有了。
CSS 3 之後支援 CMYK 顏色
語法 color: cmyk(0%, 100%, 50%, 0%);
CSS 3 不只定義了 CMYK,還有很多顏色的表示方式
給樓主參考了,但是 CMYK 其實螢幕看不會很準,還是要列印出來才算數
螢幕的色彩對比色相都能調整,而CMYK是定義輸出時的顏色,並非顯示的顏色
因此使用 CMYK 顏色,列印跟螢幕顯示一定有落差的,這無解
至於後端顏色庫,個人建議你買CMYK CARTON 回來看,然後每個顏色它都會有 CMYK 的配比,你在把你需要的顏色寫入你們的資料表內,這樣會比較好,個人相信樓主不可能所有的東西都能按照客人要求的顏色做出來,除非是印刷DM才有可能,成品是絕對不可能的,光是螢幕顯示的K 跟實際的成品,每個人的感覺都不同,要無爭議只能用 CMYK CARTON 來參照,還有你買 CARTON 色表,至於別人做好的電子檔,那都要錢,費用跟買一份CARTON 差不了多少,但電子檔通常都有保護,不是買一份每個人都能用,跟實體商品不同的
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中
2
japhenchen
iT邦超人 1 級 ‧ 2021-03-24 07:46:57

色票一定要買,請客人到現場直接選色票,你們再用色票上的值去配色做試樣給客人比對,千萬別用網頁上的顏色去做,客人看到的跟你們認定的還有生產出來的不一致,你們就賠慘了

1
淺水員
iT邦大師 6 級 ‧ 2021-03-24 09:20:13

RGB 跟 CMYK 變換很多人回答過了
但我要提醒這個轉換出來的 CMYK 如果直接拿去用的話
你們出產皮包很可能顏色會跟使用者預期的有差距

比較好的方式是使用色彩管理
https://ithelp.ithome.com.tw/upload/images/20210324/20112943m6syj3amef.png

使用者的 icc 因為不受控制,可以當作 sRGB 就可
輸出裝置的 icc 則是你們工廠要自己校正產生
由於輸出的色域跟輸入的色域不盡相同
所以顏色的使用上要受兩者 icc 檔案描述做限制
避免使用者使用到超出印刷範圍的顏色

以上只是提供一些資訊
也可能有部分錯誤
主要是提醒單純把RGB透過找得到的公式做轉換
但是你們設備沒有校正的話,很可能出問題

1
咖咖拉
iT邦好手 1 級 ‧ 2021-03-24 10:55:56

你可以用SASS來寫函數 定義

@function cmyk($c, $m, $y, $k) {

    $c: $c / 100;
    $m: $m / 100;
    $y: $y / 100;
    $k: $k / 100;

    $r: 255 * (1 - $c) * (1 - $k);
    $g: 255 * (1 - $m) * (1 - $k);
    $b: 255 * (1 - $y) * (1 - $k);

    @return rgb($r, $g, $b);

}

div {
  color: cmyk(0, 92, 79, 0);
}

也可以用套件
https://github.com/sandersk/sass-cmyk

也能用HTML 來找RGB


<script src="https://www.w3schools.com/lib/w3color.js"></script>

<div data-w3-color="cmyk(100%, 50%, 0%, 0%)">
<h1>123456789</h1>
</div> 

<script>
  w3SetColorsByAttribute();
</script>

我要發表回答

立即登入回答