# Template API v1 CSS変数一覧（自動生成）

> 組み込み28デザインのCSSで実際に参照される変数から生成。手編集しない。ここにない変数を名前から推測して使わない。

| CSS変数 | 使用例 |
|---|---|
| `--popta-badge-band-outline` | `badge/ribbon`, `badge/whiteCard` |
| `--popta-badge-band-shadow` | `badge/ribbon`, `badge/whiteCard` |
| `--popta-badge-band-surface` | `badge/ribbon`, `badge/sidebar` |
| `--popta-badge-base-color` | `badge/table` |
| `--popta-badge-container-outline` | `badge/bar`, `badge/minimal` |
| `--popta-badge-container-shadow` | `badge/bar`, `badge/minimal` |
| `--popta-badge-container-surface` | `badge/bar`, `badge/captionBar`, `badge/minimal`, `badge/retro` |
| `--popta-badge-extra-border-color` | `badge/table` |
| `--popta-badge-extra-border-width-px` | `badge/bar`, `badge/bigNumber`, `badge/card`, `badge/circular` |
| `--popta-badge-extra-corner-radius-px` | `badge/bar`, `badge/bigNumber`, `badge/captionBar`, `badge/card` |
| `--popta-badge-extra-diameter-px` | `badge/circular` |
| `--popta-badge-extra-divider-color` | `badge/bar`, `badge/captionBar`, `badge/minimal` |
| `--popta-badge-extra-divider-width-px` | `badge/bar`, `badge/captionBar`, `badge/minimal`, `badge/retro` |
| `--popta-badge-extra-icon-corner-radius-px` | `badge/sidebar` |
| `--popta-badge-extra-icon-gap-px` | `badge/sidebar`, `badge/whiteCard` |
| `--popta-badge-extra-label-value-gap-px` | `badge/bar`, `badge/bigNumber`, `badge/captionBar`, `badge/card` |
| `--popta-badge-extra-min-width-px` | `badge/bigNumber`, `badge/card`, `badge/cornerCluster`, `badge/neon` |
| `--popta-badge-extra-padding-h` | `badge/bar`, `badge/bigNumber`, `badge/captionBar`, `badge/card` |
| `--popta-badge-extra-padding-v` | `badge/bar`, `badge/bigNumber`, `badge/captionBar`, `badge/card` |
| `--popta-badge-extra-prompt-char` | `badge/retro` |
| `--popta-badge-extra-ribbon-angle-deg` | `badge/ribbon` |
| `--popta-badge-extra-ribbon-color` | `badge/ribbon` |
| `--popta-badge-extra-ribbon-corner-radius-px` | `badge/ribbon` |
| `--popta-badge-extra-ribbon-gap-px` | `badge/ribbon` |
| `--popta-badge-extra-ribbon-padding-h-px` | `badge/ribbon` |
| `--popta-badge-extra-ribbon-padding-v-px` | `badge/ribbon` |
| `--popta-badge-extra-ribbon-text` | `badge/ribbon` |
| `--popta-badge-extra-terminal-text-color` | `badge/retro` |
| `--popta-badge-font` | `badge/bigNumber`, `badge/card`, `badge/circular`, `badge/neon` |
| `--popta-badge-font-size` | `badge/bar`, `badge/bigNumber`, `badge/captionBar`, `badge/card` |
| `--popta-badge-item-gap` | `badge/bar`, `badge/bigNumber`, `badge/captionBar`, `badge/card` |
| `--popta-badge-label-color` | `badge/bar`, `badge/bigNumber`, `badge/card`, `badge/circular` |
| `--popta-badge-label-font-size` | `badge/bigNumber`, `badge/card`, `badge/circular`, `badge/neon` |
| `--popta-badge-layout-align` | `badge/bigNumber`, `badge/card`, `badge/neon`, `badge/outlineGhost` |
| `--popta-badge-pill-surface` | `badge/circular`, `badge/pill` |
| `--popta-badge-pos-x` | `badge/bigNumber`, `badge/captionBar`, `badge/card`, `badge/circular` |
| `--popta-badge-pos-y` | `badge/bigNumber`, `badge/captionBar`, `badge/card`, `badge/circular` |
| `--popta-badge-retro-outline` | `badge/retro` |
| `--popta-badge-retro-shadow` | `badge/retro` |
| `--popta-badge-ribbon-font-size` | `badge/ribbon` |
| `--popta-badge-split-label-ratio` | `badge/splitPill` |
| `--popta-badge-white-surface` | `badge/whiteCard` |
| `--popta-badge-wrap-gap` | `badge/bigNumber`, `badge/card`, `badge/circular`, `badge/neon` |
| `--popta-badge-wrap-max-width-px` | `badge/bar`, `badge/bigNumber`, `badge/card`, `badge/circular` |
| `--popta-canvas-width` | `badge/captionBar` |
| `--popta-item-first-comment-accent-color` | `badge/circular`, `badge/pill`, `popup/card`, `popup/flash` |
| `--popta-item-first-comment-badge-outline` | `badge/bigNumber`, `badge/card`, `badge/cornerCluster`, `badge/neon` |
| `--popta-item-first-comment-badge-shadow` | `badge/bigNumber`, `badge/card`, `badge/circular`, `badge/cornerCluster` |
| `--popta-item-first-comment-badge-solid-surface` | `badge/pillFilled` |
| `--popta-item-first-comment-badge-split-label-surface` | `badge/splitPill` |
| `--popta-item-first-comment-badge-split-value-surface` | `badge/splitPill` |
| `--popta-item-first-comment-badge-surface` | `badge/bigNumber`, `badge/card`, `badge/cornerCluster`, `badge/neon` |
| `--popta-item-first-comment-badge-value-color` | `badge/bar`, `badge/bigNumber`, `badge/captionBar`, `badge/card` |
| `--popta-item-first-comment-grid-row` | `badge/retro`, `badge/sidebar` |
| `--popta-item-first-comment-label` | `badge/bar`, `badge/bigNumber`, `badge/captionBar`, `badge/card` |
| `--popta-item-first-comment-popup-border` | `popup/card`, `popup/gradient`, `popup/minimal`, `popup/neon` |
| `--popta-item-first-comment-popup-gradient` | `popup/gradient` |
| `--popta-item-first-comment-popup-ring` | `popup/stamp` |
| `--popta-item-first-comment-popup-shadow` | `popup/card`, `popup/gradient`, `popup/minimal`, `popup/neon` |
| `--popta-item-first-comment-popup-solid-surface` | `popup/speechBubble` |
| `--popta-item-first-comment-popup-surface` | `popup/minimal`, `popup/pill`, `popup/stamp` |
| `--popta-item-first-comment-popup-text` | `popup/card`, `popup/flash`, `popup/gradient`, `popup/minimal` |
| `--popta-item-first-comment-popup-text-color` | `popup/minimal`, `popup/pill`, `popup/speechBubble`, `popup/stamp` |
| `--popta-item-first-comment-popup-typewriter` | `popup/underline` |
| `--popta-item-greeting-accent-color` | `badge/circular`, `badge/pill`, `popup/card`, `popup/flash` |
| `--popta-item-greeting-badge-outline` | `badge/bigNumber`, `badge/card`, `badge/cornerCluster`, `badge/neon` |
| `--popta-item-greeting-badge-shadow` | `badge/bigNumber`, `badge/card`, `badge/circular`, `badge/cornerCluster` |
| `--popta-item-greeting-badge-solid-surface` | `badge/pillFilled` |
| `--popta-item-greeting-badge-split-label-surface` | `badge/splitPill` |
| `--popta-item-greeting-badge-split-value-surface` | `badge/splitPill` |
| `--popta-item-greeting-badge-surface` | `badge/bigNumber`, `badge/card`, `badge/cornerCluster`, `badge/neon` |
| `--popta-item-greeting-badge-value-color` | `badge/bar`, `badge/bigNumber`, `badge/captionBar`, `badge/card` |
| `--popta-item-greeting-grid-row` | `badge/retro`, `badge/sidebar` |
| `--popta-item-greeting-label` | `badge/bar`, `badge/bigNumber`, `badge/captionBar`, `badge/card` |
| `--popta-item-greeting-popup-border` | `popup/card`, `popup/gradient`, `popup/minimal`, `popup/neon` |
| `--popta-item-greeting-popup-gradient` | `popup/gradient` |
| `--popta-item-greeting-popup-ring` | `popup/stamp` |
| `--popta-item-greeting-popup-shadow` | `popup/card`, `popup/gradient`, `popup/minimal`, `popup/neon` |
| `--popta-item-greeting-popup-solid-surface` | `popup/speechBubble` |
| `--popta-item-greeting-popup-surface` | `popup/minimal`, `popup/pill`, `popup/stamp` |
| `--popta-item-greeting-popup-text` | `popup/card`, `popup/flash`, `popup/gradient`, `popup/minimal` |
| `--popta-item-greeting-popup-text-color` | `popup/minimal`, `popup/pill`, `popup/speechBubble`, `popup/stamp` |
| `--popta-item-greeting-popup-typewriter` | `popup/underline` |
| `--popta-item-like-accent-color` | `badge/circular`, `badge/pill`, `popup/card`, `popup/flash` |
| `--popta-item-like-badge-outline` | `badge/bigNumber`, `badge/card`, `badge/cornerCluster`, `badge/neon` |
| `--popta-item-like-badge-shadow` | `badge/bigNumber`, `badge/card`, `badge/circular`, `badge/cornerCluster` |
| `--popta-item-like-badge-solid-surface` | `badge/pillFilled` |
| `--popta-item-like-badge-split-label-surface` | `badge/splitPill` |
| `--popta-item-like-badge-split-value-surface` | `badge/splitPill` |
| `--popta-item-like-badge-surface` | `badge/bigNumber`, `badge/card`, `badge/cornerCluster`, `badge/neon` |
| `--popta-item-like-badge-value-color` | `badge/bar`, `badge/bigNumber`, `badge/captionBar`, `badge/card` |
| `--popta-item-like-grid-row` | `badge/retro`, `badge/sidebar` |
| `--popta-item-like-label` | `badge/bar`, `badge/bigNumber`, `badge/captionBar`, `badge/card` |
| `--popta-item-like-popup-border` | `popup/card`, `popup/gradient`, `popup/minimal`, `popup/neon` |
| `--popta-item-like-popup-gradient` | `popup/gradient` |
| `--popta-item-like-popup-ring` | `popup/stamp` |
| `--popta-item-like-popup-shadow` | `popup/card`, `popup/gradient`, `popup/minimal`, `popup/neon` |
| `--popta-item-like-popup-solid-surface` | `popup/speechBubble` |
| `--popta-item-like-popup-surface` | `popup/minimal`, `popup/pill`, `popup/stamp` |
| `--popta-item-like-popup-text` | `popup/card`, `popup/flash`, `popup/gradient`, `popup/minimal` |
| `--popta-item-like-popup-text-color` | `popup/minimal`, `popup/pill`, `popup/speechBubble`, `popup/stamp` |
| `--popta-item-like-popup-typewriter` | `popup/underline` |
| `--popta-item-total-accent-color` | `badge/circular`, `badge/pill`, `popup/card`, `popup/flash` |
| `--popta-item-total-badge-outline` | `badge/bigNumber`, `badge/card`, `badge/cornerCluster`, `badge/neon` |
| `--popta-item-total-badge-shadow` | `badge/bigNumber`, `badge/card`, `badge/circular`, `badge/cornerCluster` |
| `--popta-item-total-badge-solid-surface` | `badge/pillFilled` |
| `--popta-item-total-badge-split-label-surface` | `badge/splitPill` |
| `--popta-item-total-badge-split-value-surface` | `badge/splitPill` |
| `--popta-item-total-badge-surface` | `badge/bigNumber`, `badge/card`, `badge/cornerCluster`, `badge/neon` |
| `--popta-item-total-badge-value-color` | `badge/bar`, `badge/bigNumber`, `badge/captionBar`, `badge/card` |
| `--popta-item-total-grid-row` | `badge/retro`, `badge/sidebar` |
| `--popta-item-total-label` | `badge/bar`, `badge/bigNumber`, `badge/captionBar`, `badge/card` |
| `--popta-item-total-popup-border` | `popup/card`, `popup/gradient`, `popup/minimal`, `popup/neon` |
| `--popta-item-total-popup-gradient` | `popup/gradient` |
| `--popta-item-total-popup-ring` | `popup/stamp` |
| `--popta-item-total-popup-shadow` | `popup/card`, `popup/gradient`, `popup/minimal`, `popup/neon` |
| `--popta-item-total-popup-solid-surface` | `popup/speechBubble` |
| `--popta-item-total-popup-surface` | `popup/minimal`, `popup/pill`, `popup/stamp` |
| `--popta-item-total-popup-text` | `popup/card`, `popup/flash`, `popup/gradient`, `popup/minimal` |
| `--popta-item-total-popup-text-color` | `popup/minimal`, `popup/pill`, `popup/speechBubble`, `popup/stamp` |
| `--popta-item-total-popup-typewriter` | `popup/underline` |
| `--popta-item-viewer-accent-color` | `badge/circular`, `badge/pill`, `popup/card`, `popup/flash` |
| `--popta-item-viewer-badge-outline` | `badge/bigNumber`, `badge/card`, `badge/cornerCluster`, `badge/neon` |
| `--popta-item-viewer-badge-shadow` | `badge/bigNumber`, `badge/card`, `badge/circular`, `badge/cornerCluster` |
| `--popta-item-viewer-badge-solid-surface` | `badge/pillFilled` |
| `--popta-item-viewer-badge-split-label-surface` | `badge/splitPill` |
| `--popta-item-viewer-badge-split-value-surface` | `badge/splitPill` |
| `--popta-item-viewer-badge-surface` | `badge/bigNumber`, `badge/card`, `badge/cornerCluster`, `badge/neon` |
| `--popta-item-viewer-badge-value-color` | `badge/bar`, `badge/bigNumber`, `badge/captionBar`, `badge/card` |
| `--popta-item-viewer-grid-row` | `badge/retro`, `badge/sidebar` |
| `--popta-item-viewer-label` | `badge/bar`, `badge/bigNumber`, `badge/captionBar`, `badge/card` |
| `--popta-item-viewer-popup-border` | `popup/card`, `popup/gradient`, `popup/minimal`, `popup/neon` |
| `--popta-item-viewer-popup-gradient` | `popup/gradient` |
| `--popta-item-viewer-popup-ring` | `popup/stamp` |
| `--popta-item-viewer-popup-shadow` | `popup/card`, `popup/gradient`, `popup/minimal`, `popup/neon` |
| `--popta-item-viewer-popup-solid-surface` | `popup/speechBubble` |
| `--popta-item-viewer-popup-surface` | `popup/minimal`, `popup/pill`, `popup/stamp` |
| `--popta-item-viewer-popup-text` | `popup/card`, `popup/flash`, `popup/gradient`, `popup/minimal` |
| `--popta-item-viewer-popup-text-color` | `popup/minimal`, `popup/pill`, `popup/speechBubble`, `popup/stamp` |
| `--popta-item-viewer-popup-typewriter` | `popup/underline` |
| `--popta-popup-base-color` | `popup/flash`, `popup/gradient`, `popup/ribbon`, `popup/underline` |
| `--popta-popup-extra-corner-radius-px` | `popup/card`, `popup/gradient`, `popup/minimal`, `popup/neon` |
| `--popta-popup-extra-flash-duration-ms` | `popup/flash` |
| `--popta-popup-extra-flash-font-size-px` | `popup/flash` |
| `--popta-popup-extra-flash-opacity` | `popup/flash` |
| `--popta-popup-extra-flash-text-offset-x-px` | `popup/flash` |
| `--popta-popup-extra-flash-text-offset-y-px` | `popup/flash` |
| `--popta-popup-extra-outline-width` | `popup/stamp` |
| `--popta-popup-extra-padding-h` | `popup/card`, `popup/gradient`, `popup/minimal`, `popup/neon` |
| `--popta-popup-extra-padding-v` | `popup/card`, `popup/gradient`, `popup/minimal`, `popup/neon` |
| `--popta-popup-extra-ribbon-angle-deg` | `popup/ribbon` |
| `--popta-popup-extra-ribbon-corner-radius-px` | `popup/ribbon` |
| `--popta-popup-extra-ribbon-gap-px` | `popup/ribbon` |
| `--popta-popup-extra-ribbon-padding-h-px` | `popup/ribbon` |
| `--popta-popup-extra-ribbon-padding-v-px` | `popup/ribbon` |
| `--popta-popup-extra-ribbon-text` | `popup/ribbon` |
| `--popta-popup-extra-rotation-deg` | `popup/card`, `popup/gradient`, `popup/minimal`, `popup/neon` |
| `--popta-popup-extra-tail-position-percent` | `popup/speechBubble` |
| `--popta-popup-extra-underline-width-px` | `popup/underline` |
| `--popta-popup-fixed-surface` | `popup/card`, `popup/neon`, `popup/outline` |
| `--popta-popup-font` | `popup/card`, `popup/flash`, `popup/gradient`, `popup/minimal` |
| `--popta-popup-font-size` | `popup/card`, `popup/flash`, `popup/gradient`, `popup/minimal` |
| `--popta-popup-label-color` | `popup/ribbon` |
| `--popta-popup-pos-x` | `popup/card`, `popup/gradient`, `popup/minimal`, `popup/neon` |
| `--popta-popup-pos-y` | `popup/card`, `popup/gradient`, `popup/minimal`, `popup/neon` |
| `--popta-popup-ribbon-font-size` | `popup/ribbon` |
| `--popta-popup-ribbon-surface` | `popup/ribbon` |
| `--popta-popup-typewriter-display` | `popup/underline` |
| `--popta-popup-typewriter-overflow` | `popup/underline` |
| `--popta-popup-typewriter-vertical-align` | `popup/underline` |
| `--popta-popup-typewriter-white-space` | `popup/underline` |