Biopunk 生物朋克(Biopunk)

Scope: This entry covers the visual and interface language of biopunk — organic surfaces, lab-equipment geometry, bio-data visualization, and medical UI accents. The literary subgenre (Greg Bear, Paul Di Filippo) and the DIY biohacker movement share the name but are only background; this atlas is about pixels.

范围:本条覆盖生物朋克的视觉与界面语言——有机表面、实验室设备几何、生物数据可视化以及医疗 UI 点缀。文学子类型(Greg Bear、Paul Di Filippo)和 DIY 生物黑客运动与它共享名字,但只作为背景;本图鉴讲的是像素。

SAMPLE: MK-IV TEMP: 37.2°C
Midnight Drive
Neon Coast
1:123:48

标本可交互 —— 点点看。Specimen is live — try it.

If you called it…如果你管它叫……

“interface that looks like a petri dish or lab culture”「看起来像培养皿或菌落培养的界面」“sickly green slime UI with medical readouts”「病态绿的黏液 UI 配医疗读数」“buttons that look like gel pads or organic tissue”「像凝胶垫或有机组织的按钮」“biotech dashboard with throbbing vein-like progress bars”「带搏动血管进度条的生物技术仪表盘」“flesh and mucus sci-fi interface style”「血肉和黏液的科幻界面风格」“genome sequencer or CRISPR app aesthetic”「基因测序仪或 CRISPR 应用 aesthetics 风格」

Full style DNA完整风格 DNA

  1. Grown, not machined surfaces长出来的,而不是加工出来的表面 surface defining定义特征

    Buttons and cards read as gel pads, agar plates, or semi-translucent tissue — soft, yielding, often slightly irregular edges rather than crisp geometric shapes.

    按钮和卡片读起来像凝胶垫、琼脂皿或半透明的组织——柔软、可形变,边缘常常略有不规则,而不是利落的规则几何。

  2. Sickly greens and bruised pinks病态绿与瘀青粉 color defining定义特征

    Dominant hues are bio-luminescent greens (#39ff14, #7fff00, #4ade80), mucous yellows, cold lab whites (#e8f4f8), and infected fleshy pinks (#ff6b9d, #ff85a1) against near-black or sterile grey grounds.

    主色调是生物发光绿(#39ff14、#7fff00、#22c55e)、黏液黄、冰冷实验室白(#e8f4f8),以及感染感的肉粉色(#ff6b9d、#ff85a1),衬在近黑或无菌灰底上。

  3. Pulsing vascular progress搏动的血管式进度 motion defining定义特征

    Loaders and progress bars behave like flowing fluid, creeping mold, or a heartbeat — slow organic movement with irregular pulse beats, not mechanical linear scans.

    加载条和进度条像流动的液体、蔓延的菌丝或心跳——缓慢的有机运动,带不规则脉冲,而不是机械线性扫描。

  4. Laboratory equipment metaphors实验室设备隐喻 imagery defining定义特征

    Petri dishes, test tubes, pipettes, centrifuge rings, cell grids, and DNA helixes appear as iconography, container shapes, or decorative motifs.

    培养皿、试管、移液器、离心环、细胞网格和 DNA 双螺旋作为图标、容器形状或装饰母题反复出现。

  5. Medical interface type医疗界面字体 typography supporting辅助特征

    Monospaced or squared-off sans-serif labels that mimic hospital monitors, sequencer logs, and assay readouts — clinical, small, and data-dense.

    等宽或方正无衬线标签,模仿医院监护仪、测序日志和检测读数——临床感、字号小、数据密集。

  6. Membrane and mucus textures薄膜与黏液质感 surface supporting辅助特征

    Subtle gradients, noise, or layered blur suggest a wet surface — think amniotic sheen, bacterial film, or the opalescent skin of a jellyfish.

    微妙的渐变、噪点或层叠模糊暗示湿润表面——像羊膜光泽、细菌膜,或水母的乳白色皮肤。

  7. Dense bio-data readouts密集生物数据读数 layout supporting辅助特征

    Tiny codons, base-pair sequences, heart-rate traces, and waveform readouts fill margins and corners, as if the UI is monitoring a living sample.

    角落里塞满微小密码子、碱基对序列、心电波形和示波器曲线,仿佛 UI 正在监控一个活体样本。

  8. Hard chrome and circuitry硬铬与电路 surface avoid避免

    Sharp brushed metal, glowing neon grids, and circuit-board patterns push the look straight into cyberpunk — biopunk keeps the tech soft and biological.

    锋利的拉丝金属、发光的霓虹网格和电路板纹样会直接把外观推向赛博朋克——生物朋克会让技术保持柔软和生物感。

Often confused with: Cyberpunk最容易混淆:赛博朋克(Cyberpunk)

SAMPLE: MK-IV TEMP: 37.2°C
Midnight Drive
Neon Coast
1:123:48

Biopunk生物朋克(Biopunk)

CH-07 // SIG 87%
ネオン
Midnight Drive
Neon Coast
1:123:48

Cyberpunk赛博朋克(Cyberpunk)

This is biopunk because the material world is organic, wet, and bodily — gels, membranes, flesh textures, and lab hardware — rather than chrome, neon, rain-slicked streets, and circuitry.

这是生物朋克,因为它的物质世界是有机的、潮湿的、身体的——凝胶、薄膜、血肉纹理和实验室硬件——而不是铬合金、霓虹灯、雨湿的街道和电路。

It would become cyberpunk if the slime hardened into brushed metal, the petri dishes turned into holographic billboards, the palette flipped to hot magenta and electric cyan, and the backdrop became a rain-soaked dystopian cityscape.

如果黏液硬化成拉丝金属,培养皿变成全息广告牌,配色翻成热品红和电光青,背景变成雨水浸泡的反乌托邦城市景观,它就变成赛博朋克了。

Compare: Biopunk vs Cyberpunk →对比页 →

In code — optional starting points代码写法 —— 可选起点

Petri-dish gel button

background: radial-gradient(circle at 30% 25%, rgba(255,255,255,.35), transparent 45%), linear-gradient(180deg, #4ade80 0%, #22c55e 45%, #15803d 100%); border: 1px solid rgba(57,255,20,.55); border-radius: 50%; box-shadow: inset 0 -6px 12px rgba(0,60,20,.35), 0 8px 20px rgba(34,197,94,.25);

Organic tissue card with membrane sheen

background: linear-gradient(160deg, #ff85a1 0%, #ff6b9d 50%, #db2777 100%); border-radius: 24px; box-shadow: inset 0 2px 6px rgba(255,255,255,.35), inset 0 -4px 10px rgba(120,20,60,.25), 0 10px 24px rgba(219,39,119,.2);

Slime progress bar

background: #0d1f17; border-radius: 999px; overflow: hidden;
.bar { background: linear-gradient(90deg, #39ff14, #7fff00, #39ff14); background-size: 200% 100%; animation: slime-flow 2s ease-in-out infinite; box-shadow: 0 0 14px rgba(57,255,20,.55); }

Style brief — paste into your agent风格 Brief —— 粘贴给你的代理

Build the interface as Biopunk. Canvas: near-black lab bench (#0a120f) or sterile clinical grey (#e8f4f8), depending on whether you want a dark incubation chamber or a bright clean-room readout. Defining signals: controls render as grown organic forms — gel pads, agar dishes, or semi-translucent tissue with soft irregular edges; palette anchored in sickly bio-luminescent greens (#39ff14, #7fff00, #22c55e), mucous yellows, infected fleshy pinks (#ff6b9d, #ff85a1), and cold lab whites (#e8f4f8); progress and loaders behave like pulsing fluid or creeping mold, not mechanical scans. Use layered gradients and inner shadows to create wet membrane sheen: e.g. gel button — radial-gradient(circle at 30% 25%, rgba(255,255,255,.35), transparent 45%) over linear-gradient(180deg, #4ade80, #22c55e, #15803d), with inset 0 -6px 12px rgba(0,60,20,.35) for depth. Progress bars: #0d1f17 track, #39ff14 fill with background-size: 200% 100% and a slow translate/gradient animation to suggest slime flow, plus 0 0 14px rgba(57,255,20,.55) glow. Typography: clinical monospaced or squared sans for readouts, 11–13px data labels. Imagery: petri dishes, test tubes, centrifuge rings, DNA helixes, cell grids. Do not drift into cyberpunk; the decisive difference is wet/organic/lab versus chrome/neon/dystopia. Avoid hard metal textures, circuit patterns, and hot magenta-cyan neon. Preserve text contrast (greens on black can be too dim — push luminous greens to at least #22c55e against #0a120f), visible focus states, and honor prefers-reduced-motion by stopping the slime pulse.

按生物朋克(Biopunk)构建这个界面。画布:近黑的实验台(#0a120f)或无菌临床灰(#e8f4f8),取决于你想要暗色孵化舱还是明亮洁净室读数。决定性信号:控件渲染为生长出来的有机形态——凝胶垫、琼脂皿或半透明组织,边缘柔软不规则;配色锚定在病态生物发光绿(#39ff14、#7fff00、#22c55e)、黏液黄、感染感的肉粉色(#ff6b9d、#ff85a1)和冰冷实验室白(#e8f4f8);进度和加载要像搏动液体或蔓延菌丝,而不是机械扫描。用层叠渐变和内阴影制造湿润薄膜光泽:例如凝胶按钮——在 linear-gradient(180deg, #4ade80, #22c55e, #15803d) 之上叠加 radial-gradient(circle at 30% 25%, rgba(255,255,255,.35), transparent 45%),并用 inset 0 -6px 12px rgba(0,60,20,.35) 做纵深。进度条:轨道 #0d1f17,填充 #39ff14,background-size: 200% 100%,用缓慢的平移/渐变动画表现黏液流动,再加 0 0 14px rgba(57,255,20,.55) 光晕。字体:临床等宽或方正无衬线,11–13px 数据标签。图像:培养皿、试管、离心环、DNA 双螺旋、细胞网格。不要滑向赛博朋克;决定性区别在于湿件/有机/实验室 versus 铬合金/霓虹/反乌托邦。避免硬金属纹理、电路纹样和热品红-电光青霓虹。保证文字对比度(绿色在黑底上容易偏暗——功能文字至少用 #22c55e 配 #0a120f),焦点状态可见,并在 prefers-reduced-motion 下停止黏液脉冲。

Accessibility & misuse可访问性与误用

Glowing greens and low-luminance pinks on near-black are atmospheric but often fail 4.5:1 text contrast — push functional text to at least #22c55e on #0a120f and avoid setting small labels directly on dark translucent gels without a backing layer.

发光的绿色和低亮度粉色在近黑背景上有氛围感,但常常过不了 4.5:1 的文字对比度——功能文字至少做到 #22c55e 在 #0a120f 上,不要把小标签直接放在深色半透明凝胶上而不加背层。

Pulsing, creeping, and heartbeat animations can trigger vestibular symptoms or anxiety; keep them slow and non-essential, and pause them under prefers-reduced-motion and prefers-reduced-transparency.

脉冲、蔓延和心跳动画可能诱发前庭症状或焦虑;保持它们缓慢且非必要,并在 prefers-reduced-motion 和 prefers-reduced-transparency 下暂停。

Dense medical readouts and tiny monospaced data labels raise cognitive load: reserve them for decorative corners, keep primary actions in a larger clean sans, and never rely on color alone to communicate health/critical state.

密集的医疗读数和极小的等宽数据标签会加重认知负荷:把它们留给装饰角,主操作使用更大的清爽无衬线,且不要只靠颜色传达健康/危急状态。

Origin起源

Biopunk grew out of cyberpunk in the late 1980s as writers turned from silicon networks to biotechnology: Greg Bear's 'Blood Music' (1985 novel, based on a 1983 short story) is the most-cited early landmark, and Paul Di Filippo's 'Ribofunk' (1996) coined the playful funk-biology tone. Around the same time, the term attached to a DIY biohacker movement experimenting with garage genetic engineering. As a visual style it crystallized in games, film, and app concepts that needed 'the organic opposite of cyberpunk' — all mucus, lab glass, and twitching wetware.

生物朋克在 1980 年代末从赛博朋克中生长出来,作家们把关注点从硅基网络转向生物技术:Greg Bear 的《Blood Music》(1985 年小说,源自 1983 年短篇)是最常被引用的早期里程碑,Paul Di Filippo 的《Ribofunk》(1996)则奠定了 playful 的 funk-生物学基调。同一时期,这个词也附着到在车库进行基因工程实验的 DIY 生物黑客运动上。作为视觉风格,它在游戏、电影和应用概念中结晶为「赛博朋克的有机对立面」——全是黏液、实验室玻璃和颤动的湿件。

See also相关词条