开发预览更新于 2026-05-10

Watermark 水印

在内容容器上叠加倾斜重复的文字水印，用于敏感页面追溯泄漏来源。

基础用法

content 既可以是单行字符串，也可以是字符串数组（多行水印）。水印通过 SVG 数据 URL 叠加在 ::after，pointer-events: none，不挡住内容交互。

水印覆盖整个容器，倾斜重复渲染。截图后水印仍可见，便于追溯泄漏来源。

<CfWatermark content="ChuFix UI · Confidential">
<div class="protected-area">
  <h3>敏感内容</h3>
  <p>水印覆盖整个容器，倾斜重复渲染。</p>
</div>
</CfWatermark>

<CfWatermark content="ChuFix UI · Confidential">
<div className="protected-area">
  <h3>敏感内容</h3>
  <p>水印覆盖整个容器，倾斜重复渲染。</p>
</div>
</CfWatermark>