[{"data":1,"prerenderedAt":154},["ShallowReactive",2],{"blog-zh-best-card-templates-code":3},{"id":4,"title":5,"author":6,"body":7,"category":137,"cover":138,"date":139,"description":140,"draft":141,"extension":142,"featured":141,"meta":143,"navigation":144,"path":145,"readingTime":146,"seo":147,"stem":148,"tags":149,"updated":138,"__hash__":153},"blog_zh\u002Fzh\u002Fblog\u002Fbest-card-templates-code.md","分享代码片段最好用的卡片模板","Chat2Card Team",{"type":8,"value":9,"toc":131},"minimark",[10,15,19,22,45,48,51,114,121,124,127],[11,12,14],"h2",{"id":13},"代码截图很容易翻车","代码截图很容易\"翻车\"",[16,17,18],"p",{},"终端的照片一旦被聊天软件压缩就会失真：线条变糊、颜色发灰，别人也没法复制代码。把片段渲染成卡片，则在任何尺寸下都保持清晰。",[11,20,21],{"id":21},"按场景选模板",[23,24,25,33,39],"ul",{},[26,27,28,32],"li",{},[29,30,31],"strong",{},"Midnight","——深色背景，语法高亮对比最强，最适合发在深色模式的信息流。",[26,34,35,38],{},[29,36,37],{},"Tech Blue","——冷色调、偏商务，在文档和 Slack 里都很耐看。",[26,40,41,44],{},[29,42,43],{},"Classic","——干净的浅色卡片，几乎适用于一切的安全默认。",[11,46,47],{"id":47},"保持简短",[16,49,50],{},"卡片不是文件。只展示要紧的那部分：",[52,53,58],"pre",{"className":54,"code":55,"language":56,"meta":57,"style":57},"language-ts shiki shiki-themes github-light github-dark","function toCard(markdown: string) {\n  return render(markdown) \u002F\u002F 本地解析，从不上传\n}\n","ts","",[59,60,61,92,108],"code",{"__ignoreMap":57},[62,63,66,70,74,78,82,85,89],"span",{"class":64,"line":65},"line",1,[62,67,69],{"class":68},"szBVR","function",[62,71,73],{"class":72},"sScJk"," toCard",[62,75,77],{"class":76},"sVt8B","(",[62,79,81],{"class":80},"s4XuR","markdown",[62,83,84],{"class":68},":",[62,86,88],{"class":87},"sj4cs"," string",[62,90,91],{"class":76},") {\n",[62,93,95,98,101,104],{"class":64,"line":94},2,[62,96,97],{"class":68},"  return",[62,99,100],{"class":72}," render",[62,102,103],{"class":76},"(markdown) ",[62,105,107],{"class":106},"sJ8bj","\u002F\u002F 本地解析，从不上传\n",[62,109,111],{"class":64,"line":110},3,[62,112,113],{"class":76},"}\n",[16,115,116,117,120],{},"长文件应当用 ",[59,118,119],{},"---"," 切成多张卡片，每一页呈现一个完整的代码块。",[11,122,123],{"id":123},"选对导出比例",[16,125,126],{},"屏幕用 2×，要进幻灯片或打印用 3×。把图片复制到剪贴板，粘到任何需要代码的地方即可。",[128,129,130],"style",{},"html pre.shiki code .szBVR, html code.shiki .szBVR{--shiki-default:#D73A49;--shiki-dark:#F97583}html pre.shiki code .sScJk, html code.shiki .sScJk{--shiki-default:#6F42C1;--shiki-dark:#B392F0}html pre.shiki code .sVt8B, html code.shiki .sVt8B{--shiki-default:#24292E;--shiki-dark:#E1E4E8}html pre.shiki code .s4XuR, html code.shiki .s4XuR{--shiki-default:#E36209;--shiki-dark:#FFAB70}html pre.shiki code .sj4cs, html code.shiki .sj4cs{--shiki-default:#005CC5;--shiki-dark:#79B8FF}html pre.shiki code .sJ8bj, html code.shiki .sJ8bj{--shiki-default:#6A737D;--shiki-dark:#6A737D}html .default .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html.dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}",{"title":57,"searchDepth":110,"depth":110,"links":132},[133,134,135,136],{"id":13,"depth":94,"text":14},{"id":21,"depth":94,"text":21},{"id":47,"depth":94,"text":47},{"id":123,"depth":94,"text":123},"指南",null,"2026-07-31","代码值得比截图更好的对待。了解如何把一段代码变成清晰、带语法高亮的卡片图，并为不同场景选对模板。",false,"md",{},true,"\u002Fzh\u002Fblog\u002Fbest-card-templates-code",5,{"title":5,"description":140},"zh\u002Fblog\u002Fbest-card-templates-code",[150,151,152],"代码","模板","开发者","SsGu8hWIX5ZwymqykPXn012m6r8kBGQag5bV0-6jeDw",1785582070135]