MA Quilts

白色基底、等宽文字标注与产品图像展示。
页面以白色为基底,搭配橙色文字。字体采用 Manrope、Roboto Mono。视觉特点包括等宽文字标注、产品图像展示、大字排版、宽松留白。适合参考的场景:品牌电商首页、商品展示页。
查看原始网站使用规范
建议采用
- 展示标题采用Manrope 200字重、126px字号和0.12em字间距;Tangerine填色中如低语般纤细的笔画,是品牌最鲜明的面貌。
- 66px border-radius仅用于按钮和标签;所有卡片、图像和分区都保持0px圆角,以呈现纸质海报的感觉。
- 按钮采用描边胶囊形,使用1-2px的Tangerine边框和透明填充,而非填充矩形;系统通过边框表达,而非背景。
- 分区背景采用满幅Sun Yellow、Blush Pink或Coral Wash,代替带阴影的白色卡片。
- 产品和博客图像的标签采用Roboto Mono 14px、全大写的Tangerine文字,置于图像下方并居中。
- 所有标题文字、按钮边框和元数据都使用Tangerine(#f15a24);它是字体系统中唯一的彩色表达。
- 所有展示文字和标题字号的行高均设为1.00;紧密叠排是海报美学不可缺少的一部分。
建议避免
- 不要用Tangerine或任何实色填充按钮;描边胶囊形是不可更改的要求。
- 不要为卡片、按钮或图像添加投影、渐变或任何抬升效果;系统严格保持平面。
- 展示标题不要居中;它们始终左对齐,并逐词纵向叠排。
- 展示标题不要使用Manrope 400或700字重;只有200字重才能产生标志性的纤细海报字体。
- 没有明确的视觉理由时,不要在Sun Yellow、Blush Pink和Coral Wash之外引入第四种背景色。
- 不要给图像、卡片或产品容器添加border-radius;清晰直角能保留剪贴式手工制作的身份。
- 任何标题或展示文字的letter-spacing都不要低于0.06em;宽松的字间距使文字看起来像标签,而非普通句子。