Skip to content
双端兼容 · 桌面 + 移动

Card 卡片

EwCard 是官网区块内容的容器。三种卡面风格对应不同的展示场景:tone 粉彩底适合功能亮点与作品展示, sticker 厚白描边营造轻快的贴纸质感,featured 深色渐变在浅色页面上天然成为视觉焦点。

粉彩与贴纸

tone 粉彩底 × sticker 厚白描边
cream / blue / mint / pink / lime 五种粉彩底;sticker 加 3px 白描边与轻投影。

灵感收集

奶油底 + 厚白描边
网页剪藏、随手速记

新功能热门

团队空间

淡蓝底贴纸卡
共享文档与评论协作

端到端加密

薄荷底 + 悬浮轻抬

vue
<EwCard tone="cream" sticker>…</EwCard>
<EwCard tone="mint" hoverable>…</EwCard>

深色精选卡

featured
深色渐变 + 主色光晕,适合定价主推档与关键亮点;内部标题与正文自动切换浅色。
vue
<EwCard featured>…</EwCard>

可点击卡片

tag="a" 渲染为链接卡;搭配 hoverable 即获得悬浮轻抬反馈。自定义底色用 custom-bg 覆写 tone。

API

Props

属性说明类型默认值
tone粉彩底色'plain' | 'soft' | 'cream' | 'blue' | 'mint' | 'pink' | 'lime''plain'
sticker厚白描边贴纸风booleanfalse
featured深色精选形态booleanfalse
hoverable悬浮轻抬booleanfalse
flat去边框与阴影(嵌入场景)booleanfalse
tag渲染标签(可传 'a'string'div'
custom-bg自定义底色(覆盖 tone)string

插槽

插槽说明
default卡片内容

基于 MIT 许可证发布