html-ppt-taste-brutalist

Compare original and translation side by side

🇺🇸

Original

English

🇨🇳

Translation

Chinese

HTML PPT — Tactical Telemetry / CRT Terminal

HTML PPT — 战术遥测/CRT终端

A 16:9 deck for project debriefs, security reviews, infra incident write-ups, ops walkthroughs, and any "we are not selling, we are reporting" presentation. Reads like a declassified mission packet, not a pitch deck.

This skill commits to ONE substrate (dark CRT) — never mix with the light Swiss-print mode in the same artifact.

这是一款16:9比例的演示文稿模板，适用于项目汇报、安全评审、基础设施事件复盘、运维流程讲解，以及任何“我们不是在推销，而是在汇报”的场景。风格类似解密任务文档，而非商业推介演示文稿。

本模板仅采用一种基底风格（深色CRT）——切勿在同一文档中混用浅色瑞士印刷风格。

Source

来源

Distilled from Leonxlnx/taste-skill —

skills/brutalist-skill/SKILL.md

§2.2 (Tactical Telemetry & CRT Terminal). Deck system follows the project's existing

html-ppt

convention (16:9 slides, vertical-stack fallback when opened directly).

源自Leonxlnx/taste-skill项目 —

skills/brutalist-skill/SKILL.md

第2.2节（战术遥测与CRT终端）。演示文稿系统遵循该项目现有的

html-ppt

规范（16:9幻灯片，直接打开时自动 fallback 为垂直堆叠布局）。

Hard rules

严格规则

Substrate: deactivated-CRT charcoal
```
#0A0A0A
```
/
```
#121212
```
. Never pure black.
Foreground: white phosphor
```
#EAEAEA
```
. Secondary
```
#9A9A98
```
.
Accent: ONE color — hazard red
```
#E61919
```
. Used on alerts, classifications, the latest data point. Never as a slide background fill.
Optional: terminal green
```
#4AF626
```
for ONE specific UI element across the entire deck (e.g. a single status indicator). Omit if it doesn't earn its place.
Type: monospace dominates. JetBrains Mono / IBM Plex Mono for body and meta. Heavy condensed grotesque (Archivo Black / Inter Black) only for slide titles.
Title scale:
```
clamp(56px, 7vw, 96px)
```
, uppercase, tracking
```
-0.04em
```
, leading
```
0.9
```
.
Geometry:
```
border-radius: 0
```
. Visible 1px hairlines (
```
#2A2A28
```
on charcoal). Use
```
display: grid; gap: 1px
```
over a hairline-colored background to render perfect cells.
Scanline overlay: subtle
```
repeating-linear-gradient
```
at
```
2px / 4px
```
cycle, opacity ≤
```
0.08
```
, applied as a fixed pointer-events-none layer.
Phosphor noise: optional SVG-grain pseudo-element, opacity ≤
```
0.06
```
.
Slide chrome: every slide carries top register strip — classification, slide ID, timestamp, coordinates — and a bottom bar with serial number + page.

基底色： 停用状态的CRT炭灰色
```
#0A0A0A
```
/
```
#121212
```
。绝对不能用纯黑色。
前景色： 白磷色
```
#EAEAEA
```
。次要文本色
```
#9A9A98
```
。
强调色： 仅一种颜色——危险红色
```
#E61919
```
。用于警示信息、分类标识、最新数据点。绝不能用作幻灯片背景填充色。
可选色： 终端绿色
```
#4AF626
```
，仅可用于整个演示文稿中的某一个特定UI元素（例如单个状态指示器）。若非必要则省略。
字体： 以monospace字体为主。正文和元数据使用JetBrains Mono / IBM Plex Mono。仅幻灯片标题可使用粗体压缩无衬线字体（Archivo Black / Inter Black）。
标题尺寸：
```
clamp(56px, 7vw, 96px)
```
，大写，字距
```
-0.04em
```
，行高
```
0.9
```
。
几何样式：
```
border-radius: 0
```
。可见的1px细边框（炭灰色背景上用
```
#2A2A28
```
）。使用
```
display: grid; gap: 1px
```
搭配细边框色背景来渲染完美单元格。
扫描线叠加层： 微妙的
```
repeating-linear-gradient
```
，循环周期为
```
2px / 4px
```
，透明度≤
```
0.08
```
，作为固定的pointer-events-none层应用。
磷光噪点： 可选的SVG纹理伪元素，透明度≤
```
0.06
```
。
幻灯片框架： 每张幻灯片顶部包含注册栏——分类标识、幻灯片ID、时间戳、坐标——底部包含序列号和页码栏。

Banned

禁用项

```
border-radius
```
above 0.
Drop shadows, gradients, glassmorphism, glow.
Color other than charcoal, phosphor, hazard red, and at most one terminal-green element.
Sans-serif body fonts. Monospace is the body.
Pitch-deck "delight" — emoji, illustration, stock photography, friendly icons.
Light-mode slides anywhere in the same deck.
Slide transitions other than instant cuts.

```
border-radius
```
大于0的值。
投影、渐变、毛玻璃效果、发光效果。
除炭灰色、磷光色、危险红色外的其他颜色，最多可额外使用一种终端绿色元素。
无衬线正文字体。正文必须使用monospace字体。
商业推介演示文稿的“趣味元素”——表情符号、插图、图库照片、友好图标。
同一演示文稿中出现浅色模式幻灯片。
除即时切换外的幻灯片过渡效果。

Required slide archetypes (10–14 total)

必填幻灯片原型（共10–14张）

Classification cover — giant numeral or call-sign on the left, redaction bar above the title, mono meta column on the right.
Briefing strip — eight-cell mono register with mission ID, dates, principals, classification.
Numbered objectives — three to five hairline-separated theses, each with
```
>>>
```
marker.
Telemetry grid —
```
display: grid; gap: 1px
```
of mono key-value cells; red highlight on the variant that breaks the trend.
Threat / risk register — hairline table with severity column in red.
Sequence / timeline — vertical mono list, 2-px vertical rule on the left, hazard markers on critical events.
Diagram / wiring — pure-CSS box-and-line schematic; rectangles with hairlines, ASCII arrows.
Specimen — single mono character or word at viewport-bleeding scale, used as a visual fulcrum.
Alert — diagonal hazard-stripe block (
```
repeating-linear-gradient(135deg, ...)
```
) with the most important sentence in the deck.
Audit log — append-only mono entries with timestamp + actor + event.
Closing colophon — operator, system, build, classification, sign-off line.

分类封面 — 左侧为大号数字或呼号，标题上方为遮挡条，右侧为mono元数据栏。
简报栏 — 8单元格mono注册栏，包含任务ID、日期、负责人、分类标识。
编号目标 — 3–5个细边框分隔的论点，每个论点前带有
```
>>>
```
标记。
遥测网格 —
```
display: grid; gap: 1px
```
布局的mono键值单元格；用红色高亮显示打破趋势的变体。
威胁/风险注册表 — 带细边框的表格，严重性列用红色显示。
流程/时间线 — 垂直mono列表，左侧为2px垂直规则线，关键事件处带有危险标记。
图表/布线图 — 纯CSS绘制的框图和连线示意图；带细边框的矩形，ASCII箭头。
样本展示 — 单个mono字符或单词，尺寸大到接近视口边缘，用作视觉支点。
警示框 — 斜向危险条纹块（
```
repeating-linear-gradient(135deg, ...)
```
），包含演示文稿中最重要的语句。
审计日志 — 仅可追加的mono条目，包含时间戳 + 操作者 + 事件。
结尾落款 — 操作者、系统、构建版本、分类标识、签名栏。

Motion

动效

This aesthetic is mechanical and instant.

Cuts between slides — no fades. Optionally a 60ms flicker (
```
opacity: 0.85 → 1
```
).
A blinking caret on the cover (
```
▌
```
) and a single pulse on the live status dot. Nothing else moves.

该风格强调机械感与即时性。

幻灯片切换为即时切割——无淡入淡出效果。可选择添加60ms闪烁效果（
```
opacity: 0.85 → 1
```
）。
封面页上的闪烁光标（
```
▌
```
）和实时状态点的单次脉冲效果。除此之外无其他动效。

Pre-flight

预检清单

Substrate is charcoal, foreground is phosphor, only accent is hazard red
All
```
border-radius
```
is 0; all corners are 90°
Title slide includes classification + serial + timestamp + coordinates
At least one
```
display: grid; gap: 1px
```
telemetry module
Scanline overlay applied as fixed pointer-events-none element, opacity ≤ 0.08
At least one diagonal hazard-stripe alert block
ASCII syntax decoration (
```
[ ... ]
```
,
```
>>>
```
,
```
///
```
) appears at least four times across the deck
Numeric data uses tabular-nums + monospace
No emojis, no curves, no gradients, no shadow effects
Terminal green appears on zero or one element only — never as text body color

基底色为炭灰色，前景色为磷光色，仅用危险红色作为强调色
所有
```
border-radius
```
均为0；所有角落均为90°
标题幻灯片包含分类标识 + 序列号 + 时间戳 + 坐标
至少包含一个
```
display: grid; gap: 1px
```
布局的遥测模块
扫描线叠加层作为固定的pointer-events-none元素应用，透明度≤0.08
至少包含一个斜向危险条纹警示块
ASCII语法装饰（
```
[ ... ]
```
,
```
>>>
```
,
```
///
```
）在演示文稿中至少出现四次
数字数据使用tabular-nums + monospace字体
无表情符号、无圆角、无渐变、无阴影效果
终端绿色仅用于0个或1个元素——绝不能用作正文字体颜色