MDUI文档English简体中文亮色模式暗色模式跟随系统
预设颜色
自选颜色
从壁纸提取颜色
请选择一张壁纸
开发指南
样式
与框架集成
组件
工具函数
jq 工具库 dialog alert confirm prompt snackbar getTheme setTheme getColorFromImage setColorScheme removeColorScheme loadLocale setLocale getLocale throttle observeResize breakpoint
独立包

getColorFromImage

getColorFromImage 函数用于从指定图片中提取主色调。获取主色调后,你可以使用 setColorScheme 函数来设置配色方案,从而实现动态配色功能。

使用方法

按需导入函数:

import { getColorFromImage } from 'mdui/functions/getColorFromImage.js';

使用示例:

const image = new Image();
image.src = "demo.png";

getColorFromImage(image).then(color => {
  console.log(color);
});

API

getColorFromImage(image: string | HTMLImageElement | JQ<HTMLImageElement>): Promise<string>

函数接收一个 <img> 元素的 CSS 选择器、或 HTMLImageElement 对象,或包含 <img> 元素的 JQ 对象 作为参数。

返回值为 Promise,Promise 的值为图片主色调的十六进制颜色值(如 #ff0000)。

本页目录