Angular 签名字段 | ng-hub-ui-signature
可访问的 Angular 签名字段，将鼠标、触摸和手写笔输入保存为可缩放 SVG 表单值，并支持撤销、重做和 PNG 导出。
样式
CSS 变量
用 11 个 CSS 变量为每一个像素设置主题。在 :root 处覆盖它们，或将其限定到某个容器范围内。
Signature
Design tokens read by this component. Override them on the host element (or any ancestor) to customize; every default falls back to the ng-hub-ui-ds layer.
| 变量 | 默认值 | 类型 | 描述 |
|---|---|---|---|
--hub-signature-bg | var(--hub-input-bg, var(--hub-sys-surface, #fff)) | color | Drawing-surface background |
--hub-signature-color | var(--hub-input-color, var(--hub-sys-text-primary, #212529)) | color | Field text colour |
--hub-signature-border-color | var(--hub-input-border-color, var(--hub-sys-border, #ced4da)) | color | Drawing-surface border colour |
--hub-signature-border-width | var(--hub-input-border-width, 1px) | length | Drawing-surface border thickness |
--hub-signature-border-radius | var(--hub-input-border-radius, var(--hub-ref-radius-md, 0.375rem)) | length | Drawing-surface corner radius |
--hub-signature-focus-border-color | var(--hub-input-focus-border-color, var(--hub-sys-color-primary, #0d6efd)) | color | Border colour while the surface holds keyboard focus |
--hub-signature-focus-shadow | var(--hub-input-focus-box-shadow, 0 0 0 0.25rem rgb(13 110 253 / 25%)) | shadow | Focus ring around the drawing surface |
--hub-signature-label-color | var(--hub-label-color, var(--hub-sys-text-primary, #212529)) | color | Field label colour |
--hub-signature-label-font-size | var(--hub-label-font-size, var(--hub-ref-font-size-sm, 0.875rem)) | length | Field label font size |
--hub-signature-font-size | var(--hub-input-font-size, 1rem) | length | Field font size |
--hub-signature-actions-gap | var(--hub-ref-space-2, 0.5rem) | length | Gap between the clear / undo / redo actions |
样式与主题
Match the form theme
The field inherits the forms token family and accepts a local signature token override.