这篇内容包含什么
以下每条都是“在线工具生成型”AI 提示词(Prompts)。你可以把 Prompt 直接发给 AI,让它输出一个可运行/可构建/可部署的在线图片色彩空间与 ICC 检查工具:包含完整项目代码、文件结构、运行命令、部署说明,以及测试用例或 QA checklist。
适用人群与典型场景
适合需要做颜色一致性与交付检查的设计师、前端/多媒体工程师与运营同学:例如把素材统一转换为 sRGB、检查 Display-P3 图像在非 P3 屏的表现差异、排查“同一张图在不同设备颜色不一致”的原因、批量清洗/重写 ICC 等。
在线 ICC / 色彩空间识别与报告导出工具
上传单张或多张图片,自动解析 ICC profile、色彩空间、位深与是否含 alpha,并生成可下载的 JSON/CSV 报告。
英文 Prompt:
You are a senior full-stack engineer. Build a production-ready web app called "ICC Inspector" that analyzes uploaded images and outputs a detailed color profile report.
Hard requirements:
- Output: full project source code + file tree + exact run commands.
- Tech stack: Next.js (App Router) + Type + Tailwind. Node runtime.
- Features:
1) Upload multiple images (drag/drop). Accept jpg/jpeg/png/webp/tiff.
2) For each image, detect: embedded ICC profile name (if any), color space (sRGB, Display-P3, AdobeRGB, CMYK if available), bit depth, dimensions, alpha, EXIF orientation, and whether profile is missing.
3) Generate a report table + per-file JSON panel.
4) Export report as JSON and CSV.
5) Privacy: process in-memory on server; do not store files. Add a clear UI note.
- Implementation notes:
- Use a server route (Next.js route handler) to parse data with sharp + exiftool (or a pure JS alternative). Explain any native deps.
- Provide robust error handling (unsupported file, corrupted data, huge file).
- Add rate limiting and max file size configuration.
- Deliverables section must include:
- File tree
- Local dev commands
- Production build command
- Dockerfile + docker compose
- Deployment notes (Vercel or any VPS)
- Testing:
- Provide at least 5 tests (unit/integration) OR a QA checklist with >= 10 items. Include: profile missing, profile present, orientation handling, multi-file upload, CSV export correctness.
Return ONLY the code and docs, no commentary.
中文释义: 让 AI 生成一个可部署的在线检测器,重点是“识别 ICC/色彩空间并输出报告”,用于排查素材颜色不一致与交付前自检。
sRGB / Display-P3 双向转换与ICC保留工具
把图片批量转换到目标色彩空间(sRGB 或 Display-P3),可选择保留原 ICC、替换为目标 ICC、或移除 ICC,并提供转换前后对比与下载。
英文 Prompt:
Build a web tool "Color Space Converter" that batch converts images between sRGB and Display-P3.
Requirements:
- Stack: Vite + React + Type (frontend) and a Node.js Express API (backend).
- Use sharp for conversion. Support jpg/png/webp.
- UI:
- Batch upload
- Choose target: sRGB or Display-P3
- Options: keep original ICC, replace with target ICC, strip ICC
- Show a before/after preview slider per image and data summary.
- Download as a zip.
- Backend:
- Stream uploads (multer) with size limits.
- Convert with deterministic settings (quality, chroma subsampling) configurable.
- Provide per-file logs and a final summary JSON.
- Deliverables: full repo code, file tree, run commands, env vars, Dockerfile.
- Include a minimal ICC profile set in the repo OR document how to source them.
- Tests/QA: provide at least 5 test cases (or QA checklist) including: PNG alpha preserved, ICC replaced, ICC stripped, zip download integrity, handling mixed formats.
中文释义: 让 AI 产出“批量色彩空间转换器”在线工具,核心是可控的 ICC 处理策略与可下载的批量结果。
批量校验:缺失ICC/异常色彩空间自动标红与修复建议
对一批图片做合规检查:缺失 ICC、CMYK/灰度、位深异常、尺寸过大等自动标红,并给出可执行的修复建议与一键修复(可选)。
英文 Prompt:
Create a web app "Image Color QA" that validates a batch of images and flags risky color/profile issues.
Hard rules:
- Output: full code + file tree + run/build/deploy commands.
- Stack: Next.js + Type .
- Checks per image:
- ICC missing
- Color space is CMYK/Gray/Unknown
- Bit depth not 8-bit for web targets
- Dimensions exceed configurable max
- File size exceeds configurable max
- UI:
- Batch upload, sortable table, filters (only issues).
- For each issue, show: why it matters + suggested fix.
- Optional: "Fix to sRGB" button that converts and embeds sRGB ICC.
- Export: JSON report + downloadable fixed images as zip.
- Security: validate MIME, limit concurrency, sanitize filenames.
- Provide at least 10-item QA checklist; must include: mixed formats, corrupted file, huge file, CMYK detection, conversion correctness, zip integrity.
中文释义: 让 AI 输出“批量质检 + 修复建议”的在线工具,适合团队交付前一键排查与统一到 sRGB。
ICC 差异对比:两张图的 profile/色彩空间差异高亮
上传两张图片,比较 ICC 元数据差异与关键字段(profile 名称、渲染意图、色度坐标等),生成对比报告。
英文 Prompt:
Build "ICC Diff" - a web tool that compares embedded ICC profiles of two images and highlights differences.
Requirements:
- Stack: SvelteKit + Type .
- Accept: jpg/png/webp.
- Show:
- Side-by-side data summary
- Diff view for ICC tags (as key/value), including rendering intent, profile class, color space, PCS, creation date if available.
- Download diff report as JSON.
- Implementation:
- Use a library to parse ICC profiles OR implement a minimal parser for common tags. Document limitations.
- Deliverables:
- Full code, file tree, run commands, Dockerfile.
- Tests: at least 5 tests or QA checklist (tag extraction, missing ICC, invalid ICC, diff formatting, JSON export).
中文释义: 用于定位“为什么两张看起来一样的图在不同端颜色不一致”,通过 ICC tag 级别对比给出可复现的差异报告。
色域可视化与警告:超出 sRGB 范围的像素比例统计
对 Display-P3/AdobeRGB 等图片,统计落在 sRGB 之外的像素比例,并在预览上用遮罩标注“可能发生夹逼/失真”的区域。
英文 Prompt:
Create an online tool "Gamut Warning" that estimates which pixels of an image are out of sRGB gamut.
Constraints:
- Do NOT generate new images; only analyze the uploaded image.
- Stack: Vite + Vue 3 + Type . Do analysis in the browser using WebAssembly (recommended) or WebGL shaders.
- Features:
- Load an image, detect/assume its source color space ( d on ICC if available).
- Convert to linear RGB, then determine out-of-gamut when mapped to sRGB.
- Show overlay mask with adjustable threshold.
- Output stats: percentage of out-of-gamut pixels, histogram.
- Export a JSON report.
- Deliverables:
- Full source + file tree + commands
- A small architecture note about performance
- QA checklist >= 10 items including: large image performance, missing ICC behavior, overlay correctness, export.
中文释义: 这条 Prompt 会生成一个“色域警告”在线工具,帮助判断把素材统一转 sRGB 时可能出现的颜色夹逼风险。
批量重写 ICC:按规则匹配文件夹并统一嵌入指定 Profile
针对多项目素材:根据目录规则/命名规则批量匹配,统一嵌入指定 ICC(例如 sRGB IEC61966-2-1),并生成可回滚清单。
英文 Prompt:
Build "ICC Batch Rewriter" - a web app that rewrites/embeds ICC profiles into many images with rule- d selection.
Requirements:
- Stack: Node.js (Fastify) backend + React frontend.
- Upload a zip folder of images; preserve folder structure.
- Rules:
- Include/exclude by glob
- Only rewrite if ICC missing OR if ICC is not in an allowlist
- Choose target ICC: sRGB (default), Display-P3
- Output:
- Download converted zip
- Generate a rollback manifest (JSON) listing original hashes and new hashes
- Provide a "dry-run" mode that only reports what would change
- Deliverables: full repo code, file tree, commands, Dockerfile.
- Tests/QA: at least 5 cases including: preserve paths, dry-run, allowlist skip, rewrite correct, manifest integrity.
中文释义: 生成一个“带回滚清单的批量 ICC 重写工具”,适合团队对历史素材做规范化处理。
面向前端交付:一键生成 Web 最佳实践输出(格式/质量/ICC)
把原始素材一键转换为 Web 常用输出(WebP/AVIF 可选)、指定质量与尺寸策略,并强制统一 ICC 与元数据策略,附带可复用的配置文件。
英文 Prompt:
Create a web app "Web Image Exporter" that converts uploaded images to web-optimized outputs with consistent color profile handling.
Hard requirements:
- Stack: Next.js + Type + sharp.
- Inputs: jpg/png.
- Outputs: webp (required), avif (optional toggle).
- Settings:
- Resize (max width/height)
- Quality
- data policy: keep orientation but strip other data
- ICC policy: embed sRGB ICC in outputs
- UX:
- Batch upload
- Live estimate of output size
- Download zip
- Save/load a JSON preset
- Deliverables:
- Full repo with file tree
- Commands for dev/build
- Dockerfile
- Tests/QA >= 10 items including: preset save/load, zip download, orientation correctness, ICC embedded.
中文释义: 生成一个“前端交付导出器”在线工具,把多源素材统一到 Web 输出与统一色彩策略,降低线上颜色偏差与资源体积。