Loading...
Loading...
把文字渲染成逼真的 X(推特)帖子分享卡:认证勾、蓝色话题链接、互动数据,导出 PNG
填上昵称、正文和几个互动数字,浏览器就会画出一张像真截图的 X 帖子卡片。默认 1200 宽的尺寸会跟着正文长短伸缩,所以一句话和三段长文都能排得很自然。# 开头的词、@ 提及和 http 链接会自动变成 X 蓝。
想用自己的头像和配图也行,两者都在本地读取、不会上传。互动数会按 X 的习惯压缩显示(中文界面下大数会写成 12万),卡片可选经典深色 #0f1419 或白底。导出 PNG 有三档:1200×自适应、1280×720、正方形 1080×1080。
认证蓝勾、变蓝的话题与链接、回复/转发/点赞/查看四组图标,加上时间和浏览量,版式照着 X 来,一眼看着像真的
X 经典深色 #0f1419 和白底卡片,点一下就切换
中文界面下 120000 显示成 12万,1 万以下保持原样(2300 就是 2300);切到英文界面则写成 120K、2.3K
整张卡片用 Canvas 绘制、toDataURL 导出,正文、头像、配图都不经过服务器
正文里 # 或 @ 开头的词、以及 http 开头的链接会自动变成 X 蓝,换行也按你打的原样保留,怎么排就怎么显示。
填昵称和 @handle,需要的话勾上认证蓝勾
写正文,可以顺手传一张自己的头像和帖子配图
填时间文字,以及回复 / 转发 / 点赞 / 查看四个数字
选尺寸和主题,看右侧实时预览,然后下载 PNG
把一段犀利观点包成帖子卡,放进公众号、博客头图或幻灯片
用大家一眼就认得的社交帖样式来展示新版本或活动
把自己的帖子排成高清图,发到那些没法嵌入推文的平台上
原型或 PPT 里要一条像样的社交帖子?填上看着真的数据直接生成一张
全程 Canvas 2D:渐变头像圆(或你裁好的上传图)、用圆弧加直线画的互动图标(爱心是贝塞尔曲线),以及逐 token 着色——把 #、@、http 的连续片段送成 X 蓝 #1d9bf0。文字逐字符换行,中英混排断行干净。自适应高度那档会先在一张高画布上画一次量出内容底部,再按精确高度重画一次。
100% 浏览器本地渲染,正文、头像、配图都不会到达服务器。
停手 150ms 后才重绘,单张卡片只要几毫秒——连自适应高度那档也只是先量一次、再正式画一次。