SuperAPI AI 工具集

social-spotify-card

设计与创作

查看项目

更新于 10-16 01:37

技能介绍

用途:把一首歌、一段播客或个人介绍渲染成 Spotify 正在播放卡,适合视频叠加、个人 about 页或创作者 hero 区域。灵感来自 hyperframes spotify-card。

主要能力:提供两种画布尺寸——横版视频叠加 1280×720(卡片居中或左下角浮动)与紧凑横条 widget 600×200(可嵌入 hero)。卡片结构包含圆角外框、暗色渐变或 Spotify 经典 #121212 背景、1px 细边框;左侧专辑封面(CSS 渐变加大字 monogram 或抽象几何,禁止外链图片);右侧依次为 NOW PLAYING 标签、歌名/标题、艺人/副标、进度条与两端时间戳、播放控制行(内联 SVG 图标),右上角 Spotify logo,可选右下角音波动效。

使用方式:单文件 HTML。字体主用 Spotify Circular,回退 Inter / Inter Tight,字重 400/700。若输入为文本或标题,把标题当歌名、副标/作者当艺人,时长默认估算为 3:42;若输入与音乐相关则直接对应。

限制:严禁外链图片,封面只能用 CSS 渐变加文字 logo 或几何描绘;音波动效使用 @keyframes,并可通过 prefers-reduced-motion 关闭。资料未提供安装命令、收费、平台或效果数据。