跳到内容

带阅读时长条的博客卡片

博客 · Pro 源码

这是一个博客区块,适合读者最先关心文章长度的网站。每张卡片底部是一条通栏页脚,一侧是阅读时长,另一侧是 Read full 标签,读者在看摘要之前就能分辨出这是一篇五分钟短文还是二十分钟的深度长文。头条帖子的封面图和正文横向铺满整行,下方并排放置另外两篇。

打开实时预览获取 Neobrutalism Pro
博客
Neobrutalist blog cards for React and Tailwind CSS: a wide split card with a photo on the left and headline, excerpt and a black footer bar reading 12 min read next to a yellow Read full chip, above two matching cards with cover photos and the same footer bar.
带阅读时长条的博客卡片
  • Hero、定价与登录
  • 预览每个断点
  • 复制源代码
  • MCP 已准备好安装
  • Radix · Base UI · React Aria
  • 158 现成砌块
  • 已发布的页面部分
  • 仪表盘与营销
  • Pro 解锁密码
  • 即用型布局
预览免费全屏打开并切换断点或主题。代码Pro一个独立的 TSX 文件。复制它，拥有它。安装Pro一条 shadcn CLI 命令，或用于 Claude Code、Cursor 等 MCP 客户端的代理提示。

构建工具

加上 lucide-react 图标和 Tailwind CSS — 无其他运行时依赖。

更多 博客 布局（7）

查看全部

https://neobrutalism.com/zh/blocks/blogs/blog-cards-with-read-time-bar

喜爱。 开发者、设计师，
创作者都

  • 偶然刷到你的 UI 套件就立马入手。这么新还在活跃维护、不断改进，干得漂亮 🤘

    Ziv Reich, 软件开发者

  • 只想说 neobrutalism.com 做得太棒了，真的很喜欢。我不擅长设计，所以它帮了大忙，我拿它做了自己的个人网站。

    Paul Bratslavsky, Coding With Paul 主理人

  • 终于用 Neobrutalism.com 重做了个人网站——好玩的库，上手也简单！

    Cameron Blackwood, 内容创作者

  • Neobrutalism.com 是我最爱的复古风 UI 组件库之一——组件真能拿去上线。

    Zhengyang Hou, 独立开发者

  • Web 上我最喜欢的 UI 库之一。做得很棒，希望它越走越远。

    Taseen Tanvir, 创始人 & 设计师

  • 刚试了 Neobrutalism.com Pro，不跟风的 UI 套件真是耳目一新。新粗野主义区块 🔥 让怪又好玩的原型快多了。

    Nitesh Padghan, 捉刀写手

  • 落地页设计出色，节奏与平衡都恰到好处。配色与动效结合，带来非常出色的用户体验。

    Alan Obeng-Peprah, 高级设计师 @ NativeXAI

  • 他们对设计的交付让我非常满意。最终成品与我设想的完全一致。

    Desmond, 联合创始人 @ VectorlabsVentures

  • 作为代理公司负责人，我通常要花几周打磨客户的落地页布局。用 Neobrutalism.com 后，套上模板、改好文案就能上线。

    Duke Opoku Amankwah, 创始人 @ Midas

  • 这些模板不仅视觉出色，结构也极其清晰。为我们节省了数周开发时间。

    Abiola Braimah, 开发者 @ Studio IX

  • 品质出众，细节到位。响应式设计在所有设备上都运行得很稳。

    Acromond X., 联合创始人 @ VectorlabsVentures

  • 把这些模板接入工作流后，我们的开发周期明显缩短。做得很好。

    Raquib S., 后端开发者

  • 这些模板已成为我们的首选资源。代码干净、文档齐全，也很容易定制。

    Hallic M., 开发者 @ AtlasLabs

  • Neobrutalism.com 模板在美学与功能之间取得了完美平衡，对我们的项目是真正的改变。

    Ibrahim S., 前端负责人 @ ScaleUp

  • 支持出色，模板质量也是 premium 级别。这些模板的投资回报非常惊人。

    Kevin K., CEO @ WebCraft

  • Neobrutalism.com 模板彻底改变了我们接手新客户项目的方式。代码质量极高，设计也真正达到一流水准。

    Danny G., DevStack 创始人

  • 我用过很多模板库，但 Neobrutalism.com 在性能优化与干净代码架构上的投入格外突出。

    Ian D., Wavelength CTO

  • 这些模板里的动画与微交互非常惊艳。对我们设计团队来说是最好的投资。

    Ben S., PixelPerfect 首席设计师

  • 作为非技术创始人，Neobrutalism.com 模板帮我们在不牺牲设计质量的情况下以创纪录速度上线 MVP。投资人非常惊喜。

    Matthew I., 创业公司创始人

  • 我很欣赏这些组件的模块化与文档质量。我们能无缝混用不同模板的片段。

    Garrett P., TechFusion 前端负责人

  • Neobrutalism.com 模板的投资回报惊人。我们大幅缩短开发时间，同时交付更高质量的站点给客户。

    Xavier C., 代理公司负责人

常见
问题

带阅读时长条的博客卡片 区块如何组成、可以更改的内容，以及何时使用它而不是此处的其他布局。

访问受限问题？请发送电子邮件[email protected]
Get Pro — Save 33%--:--:--