Restaurant Web Inspiration · by Category

🍳 早午餐·Brunch · 灵感站

已收集 16 / 目标 15 家 · 全部 curl 验证活站 + 真实截图 · 点截图或网址直接打开

← 返回灵感库总览
❤ 我的收藏 (0)
这一类已收 16 家,还差 0 家到目标 15。要补充就让我「深挖早午餐·Brunch」,我会从 Awwwards / CSSDA 等获奖库继续找设计惊艳的加进来。
🆕 本轮新收录16 家
TOKINEW · 2026-07-13

TOKI

88
早午餐·Brunch · 阿姆斯特丹·荷兰
www.toki-times.com/ ↗

全站用 IBM Plex Mono 做正文和 UI(等宽字体优先的系统,餐饮圈几乎没人这么干)+ Founders Grotesk 做标题。白底 + 单一朱红,没有第二个颜色。导航是无限横向滚动的 marquee 跑马灯。自定义'果冻/透镜'光标会在图片上产生扭曲。页脚跑实时数据:当地时间逐秒跳 + 当前气温。DVTK 工作室作品,这批 brunch 里欧洲最强的一个。

Holybelly 5 & 19NEW · 2026-07-13

Holybelly 5 & 19

85
早午餐·Brunch · 巴黎·法国
holybellycafe.com/ ↗

完全手写:一个 8.3KB 的 main.css,无 CMS、无框架、零 JS 库。自托管字体就叫 hb。全站只有三个颜色:浅灰 #F2F2F2 / 中灰 #717171 / 绿 #1E792C(跟餐盘绿边一致)。摄影就是全部设计。⚠️老域名 holybel.ly 已被劫持成 SEO 垃圾站,这个才是真站。

The Kettle BlackNEW · 2026-07-13

The Kettle Black

84
早午餐·Brunch · 南墨尔本·澳大利亚
www.thekettleblack.com.au/ ↗

手写静态站,全站只有 #111111 和 #FFFFFF 两个颜色,一个都不多。Letter Gothic Std(打字机等宽体)+ TT Turns。零装饰、零渐变、零阴影,纯靠排版和留白撑场。是那种'什么都不做'反而最难做的克制路线。

Mokonuts / Mokochaya / LocomalNEW · 2026-07-13

Mokonuts / Mokochaya / Locomal

82
早午餐·Brunch · 巴黎·法国
www.mokonuts.com ↗

全站只用一套字体 IM Fell DW Pica(17 世纪活版印刷的复刻体,带毛边和油墨扩散感)。纸白底 #FFFDF6,三个姊妹店各有自己的墨色:砖红 #C52A13 / 鼠尾草绿 #699B8D / 橙 #F97E00。首页没有 hero 图,就三个居中的字标——极度自信。

DimesNEW · 2026-07-13

Dimes

80
早午餐·Brunch · 纽约·美国
www.dimesnyc.com/ ↗

底层是 Squarespace 但被彻底重写,看不出一点模板痕迹。自有字体 'am' + 自制图标字体 'dime-icons'(连图标都做成了字体)。奶油黄 #F9E49C + 番茄红 #F0523D + 近黑 #272727,三色系统很干脆。

Apollo BarNEW · 2026-07-13

Apollo Bar

80
早午餐·Brunch · 哥本哈根·丹麦
apollobar.dk/ ↗

全站只用一套 Weiss Antigua——标题、正文、按钮全是它,没有任何无衬线字体出现。骨白底 #F9F9EF,按钮是 1px 细线描边的胶囊。Frederik Bille Brahe 的店。跟同老板的 Atelier September 成对研究会很有意思:一个全衬线,一个全钴蓝。

Atelier SeptemberNEW · 2026-07-13

Atelier September

78
早午餐·Brunch · 哥本哈根·丹麦
cafeatelierseptember.com/ ↗

白底 + 一个深钴蓝,所有文字和 CTA 全是这一个蓝。图片故意不对齐基线,制造一种手工排版的错落。跟 Apollo Bar 同一个老板(Bille Brahe),两站放一起看能看出同一人的两种极端解法。⚠️旧域名 atelierseptember.dk 已变赌场垃圾站,别碰。

billsNEW · 2026-07-13

bills

78
早午餐·Brunch · 悉尼·澳大利亚
bills.com.au/ ↗

Next.js + Sanity。品牌色直接暴露在 CSS token 里:米白 #FFFFF4 / 蛋黄 #FFE974 / 橙 #FFBF3E / 粉 #FFECDA / 炭 #3A3635。自有 display 字体 Hermes。'澳式 brunch 之父'的店(scrambled eggs 的原点),视觉一直是暖调高饱和。

GranolaNEW · 2026-07-13

Granola

78
早午餐·Brunch · 哥本哈根·丹麦
www.granola.dk ↗

摄影是机顶闪光灯 + 35mm 胶片——硬直闪、颗粒、过曝高光,故意反精修,跟 Bille Brahe 那套精致派完全相反。手绘斜体 script 字标装在一条撕纸绶带里。左侧固定竖排导航,右半整块大图。Adobe Garamond Pro(图注)+ Proxima Nova(导航)+ DIN Condensed。

BistrothequeNEW · 2026-07-13

Bistrotheque

78
早午餐·Brunch · 伦敦·英国
www.bistrotheque.com ↗

Nuxt + Sanity。定制字体 BistrothequeModern.woff2——logo 本身就是这套字体的一个 cut,不是单独画的图形。这种'字体即品牌'的做法比做一个 logo 图片高级一档。东伦敦老牌,视觉一直很冷。

All TimeNEW · 2026-07-13

All Time

77
早午餐·Brunch · 洛杉矶·美国
alltimelosangeles.com/ ↗

Next.js,字体全部自托管 woff2,零 Google Fonts 依赖(说明是认真选过字的)。Howler studio 设计。站内有 playlist 和 merch 板块,把餐厅当成一个文化 IP 来运营而不只是吃饭的地方。

Granger & CoNEW · 2026-07-13

Granger & Co

76
早午餐·Brunch · 伦敦·英国
grangerandco.com/ ↗

Next.js,自有字体 Hermes——跟 bills 的 CSS hash 完全一致,说明同一套设计系统服务两个品牌(Bill Granger 本人的两个招牌)。可以拿来当'一套系统跑多品牌'的样本看。

Paramount Coffee ProjectNEW · 2026-07-13

Paramount Coffee Project

74
早午餐·Brunch · 悉尼·澳大利亚
www.paramountcoffeeproject.com.au ↗

Squarespace 重度定制,模板骨架已经看不出来。Panama(高对比衬线)+ PP Neue Montreal Mono 的搭配。名字里带 coffee,实际是餐食主导的 all-day dining。

The WolseleyNEW · 2026-07-13

The Wolseley

74
早午餐·Brunch · 伦敦·英国
www.thewolseley.com/ ↗

自建站。Fellix + Victor Serif,近黑 #0F0D0A + 米白 #F5F5F0,视频 hero。伦敦最有名的 all-day grand café。⚠️现已扩成集团站(含酒店),企业味比单店时期重了。

Wild by TartNEW · 2026-07-13

Wild by Tart

74
米其林指南收录
早午餐·Brunch · 伦敦·英国
wildbytart.com/ ↗

Webflow。Ivy Ora Display + Marcellus + Futura Std 三套字体。矢车菊蓝 #6687D6 + 橄榄炭 #3D3A31 + 燕麦 #EFEBE2,这个蓝在餐饮站里很少见。⚠️实际以 lunch/dinner 为主,brunch 不是核心。

Sadelle'sNEW · 2026-07-13

Sadelle's

72
早午餐·Brunch · 纽约·美国
www.sadelles.com ↗

Next.js + Sanity,#F6F0EA 米底。纽约最出名的 bagel + 熏鲑鱼 brunch。⚠️属 Major Food Group 集团,视觉偏企业化,不如独立店有个性。