Firefox 瀏覽器附加元件
  • 擴充套件
  • 佈景主題
    • 用於 Firefox
    • 字典與語言套件
    • 其他瀏覽器網站
    • Android 版的附加元件
登入
Chromafy 預覽

Chromafy 作者: Prajwal

Apply generated color palettes to any website using specific class names or CSS variables. Use your own or any other website as a playground to see which color combination looks the best.

0(0 筆評分)0(0 筆評分)
1 位使用者1 位使用者
下載 Firefox 並安裝擴充套件
下載檔案

擴充套件後設資料

畫面擷圖
example code showing various class names and the corresponding resultsapplying colors to an element by adding class names through inspect element dev tools - 1applying colors to an element by adding class names through inspect element dev tools - 2after finalizing a color palette, you can export css code in order to use in your websitecolor picker component to manually customize any color from the palette
關於此擴充套件
Chromafy helps users apply color palettes to any website. User can generate different color palettes, customize them, export them as css code or download as a file, and go to previously selected palettes. These palettes are then applied to the website in the background when the extension is launched. The user has to give certain class names to html elements or use css variables and the appropriate colors will be given to those elements.

Example showing use of class names to apply color palettes:
class = "bg-chroma-secondary-25"
Applies the secondary color from your palette with 25% opacity to the background (CSS background-color property) of an element.

class = "fg-chroma-primary"
Applies the primary color from your palette to the foreground text (CSS color property) of an element.

CSS variables can be used similarly, it does not require specifiying "bg" or "fg":
<css-selector>{
background-color: var(--chroma-primary-75, #fff);
}

refer to the documentation here to understand everything related to Chromafy: https://chromafy.vercel.app/docs/setup

Say goodbye to the hassle of trying out different colors one by one. Browse through, generate and customize color palettes while applying them to any website simultaneously, all with just a few tweaks in the code. It can be helpful for users who want to select the best colors for their website on their own website as a playground.


Updates:
• Version 1.1
- rearranged buttons, updated icons
- added information card
由 1 位評論者給出 0 分
登入後即可幫此擴充套件評分
目前沒有評分

已儲存星等

5
0
4
0
3
0
2
0
1
0
還沒有評論
權限與資料

必要權限:

  • 存取您所有網站中的資料
了解更多
更多資訊
附加元件網址
  • 首頁
  • 技術支援網站
  • 技術支援信箱
版本
1.1
大小
839.94 KB
最近更新
2 年前 (2024年6月6日)
相關分類
  • 網頁開發
  • 外觀
授權條款
CC BY-NC-ND
隱私權保護政策
閱讀此附加元件的隱私權保護政策
版本紀錄
  • 瀏覽所有版本
新增至收藏集
檢舉此附加元件
前往 Mozilla 官網

附加元件

  • 關於
  • Firefox 附加元件部落格
  • 擴充套件工作坊
  • 開發者交流中心
  • 開發者政策
  • 社群部落格
  • 討論區
  • 回報 Bug
  • 評論撰寫指南

瀏覽器

  • Desktop
  • Mobile
  • Enterprise

產品

  • Browsers
  • VPN
  • Relay
  • Monitor
  • Pocket
  • Bluesky (@firefox.com)
  • Instagram (Firefox)
  • YouTube (firefoxchannel)
  • 隱私權
  • Cookie
  • 法律資訊

除另有註明外,本站內容皆採用創用 CC 姓名標示—相同方式分享條款 3.0 或更新版本授權大眾使用。