input | output 图标设计
对于表达大模型(LLM)的输入(Input/Prompt)和输出(Output/Response),使用 Lucide 图标(lucide.dev)时,推荐以下两组干净、一致且语义清晰的组合:
最推荐组合(强烈建议用这一组):
-
输入(Input):
text-cursor-input
(一个带闪烁光标的输入框图标,非常直观地代表“用户输入提示词”或“文本输入”) -
输出(Output):
message-square-text或bot/sparkles
最佳搭配是message-square-text(带文本的消息气泡,代表模型生成的回复内容)
或者用bot(机器人头像,强调AI生成)
或者sparkles(星星闪烁,代表AI魔法/生成结果)
为什么这个组合好?
text-cursor-input 专为“输入”设计,视觉上像用户在打字;message-square-text 则完美对应模型的“输出文本”,左右对比非常清晰,方向感强(左输入 → 右输出)。
其他优秀备选组合:
-
文件/数据流风格(适合技术/节点式界面):
- 输入:
file-input - 输出:
file-output
- 输入:
-
箭头/流程风格(强调数据流动):
- 输入:
import(或arrow-right+text-cursor-input组合) - 输出:
export(或arrow-right+message-square)
- 输入:
-
AI 专属风格(更现代、强调大模型):
- 输入:
text-cursor-input或terminal - 输出:
bot+sparkles(或单独用bot)
- 输入:
建议使用方式(UI 设计小贴士):
- 输入图标放左侧/上方,用蓝色调(用户侧)
- 输出图标放右侧/下方,用紫色/绿色调(AI侧)
- 可以加一个小箭头(
arrow-right)连接两者,突出“输入 → 输出”的流程
你可以在 https://lucide.dev/icons/ 直接搜索这些名字预览效果。
如果你告诉我具体的使用场景(比如聊天界面、节点编辑器、参数面板等),我可以再帮你细化更精确的推荐!需要我帮你列出更多类似图标吗?