Canonical: https://botbento.com/zh/usecases/generating-custom-vector-illustrations-as-svg-code/
Format: Markdown representation of the public HTML page.

[首页](/) / [用例](/zh/usecases/) / [编程](/zh/usecases/?category=coding)

编程 · 中级

已验证

自动化验证

- 已通过全部自动化关卡：结构校验、唯一性、HTTPS 与来源链接可访问、提示注入与安全扫描、审批步骤规则。
- 未记录起草模型。
- 第二模型审核：deepseek-v4-pro（无严重或高危问题）。
- 简体中文译文：google/gemini-4-argon，由 openai/gpt-5.5 审核。
- 验证于 2026-10-16。
- 仅经自动化检查和 AI 审核，未经人工审核。[验证如何运作](/zh/usecases/verification/)

# 以 SVG 代码形式生成自定义矢量插图

将创意视觉概念转化为可直接用于 Web 的整洁矢量图形

[在 BotBento 中使用 ](https://app.botbento.com/?ref=usecases&utm_source=botbento.com&utm_medium=usecases&utm_campaign=generating-custom-vector-illustrations-as-svg-code)复制提示词分享[Markdown](/text/zh/usecases/generating-custom-vector-illustrations-as-svg-code/index.md)[English](/usecases/generating-custom-vector-illustrations-as-svg-code/)

打开 BotBento。请将提示词粘贴到 Bot 中；不含任何预设配置。

- 你提问时触发接收插图提示词
- 然后生成并验证 SVG 代码
- 结果交付原始矢量文件

将描述性的视觉概念转化为格式为整洁 SVG 标记的独立、可缩放矢量图形。Bot 会构建路径、分组、颜色和 viewBox 属性，为用户界面或资产目录生成轻量级插图。

## 起步提示词

BotBento推荐

```
当用户提供插图提示词时，编写整洁且有效的 SVG 标记，其中包含所有必要的路径、多边形和内联样式。不要链接外部光栅图像或脚本。验证 viewBox 和尺寸是否已正确配置。应要求在本地保存输出文件，但在覆盖现有文件或将更改提交到版本控制之前，必须获得用户确认。
```

复制

## 所用工具

聊天终端

## 适用于

BotBento

## 标签

- svg
- vector
- frontend
- graphics
- design

## 来源

[Show HN: Extending LLM SVG generation beyond pelicans and bicycles](https://news.ycombinator.com/item?id=45845717)
Hacker News · 已核查 2026-10-15

内容以我们自己的话概述。其中描述的任何结果均为原作者所述，并非 BotBento 实测。

由 AI 辅助自英文版翻译，并经自动审核模型检查。以英文文本为准。

作者：BotBento Editorial · 发布于 2026-10-15 · 更新于 2026-10-15 · [提交更正](/contact/)

## 相关用例

-

编程中级

## [根据概念提示词生成语义化 SVG 矢量插图](/zh/usecases/generating-semantic-svg-vector-illustrations-from-concept/)

将复杂的描述性需求转化为整洁、独立的 SVG 代码，并预览可渲染的矢量资产

聊天终端[已验证](/zh/usecases/verification/)
-

编程中级

## [通过命令行生成界面组件](/zh/usecases/generating-interface-components-via-command-line/)

使用终端工具将 UI 需求转化为画布图层、布局框架和设计令牌

终端聊天[已验证](/zh/usecases/verification/)
-

编程中级

## [在暖色显示滤镜下审查主题调色板](/zh/usecases/auditing-theme-color-palettes-under-warm-display/)

在启用防蓝光滤镜时，检查语法和 UI 配色集的可读性与区分度

聊天GitHub[已验证](/zh/usecases/verification/)