scandinavian-design README

The project's README from github.com/ericzakariasson/scandinavian-design. As one markdown file: README.md.

Scandinavian Design

A Cursor agent skill for applying a restrained Scandinavian visual system to a codebase: black-and-white foundation, sans-serif type, generous spacing, and purposeful product imagery.

Scandinavian design showcase

Ten sites, before rewritten into after.

Install

Install with npx skills add ericzakariasson/scandinavian-design.

The skill is skills/scandinavian-design/. Nothing else in this repo is needed.

git clone https://github.com/ericzakariasson/scandinavian-design
cd scandinavian-design
cp -r skills/scandinavian-design ~/.cursor/skills/
npm --prefix ~/.cursor/skills/scandinavian-design/scripts install

Then invoke /scandinavian-design on the surface you want redesigned.

Eval

demos/ holds ten live sites restyled through the CSS-override fallback, with before/after captures at desktop and mobile — the set the skill was tested and corrected against. Browse them at scandinavian-design.vercel.app or locally:

npm install && npm run eval   # re-capture everything
npm run site                  # viewer on :4173
npm run showcase              # Remotion studio — before/after scan rewrite
npm run showcase:render       # write showcase.mp4 for the landing page

feedback.md records what each demo taught the skill, including the claims that were checked and rejected.

scandinavian-design (ericzakariasson/scandinavian-design)

Searching Database…

这是什么?它是一个 Cursor 智能体技能,能把代码库重新设计成克制的斯堪的纳维亚风格:黑白配色、无衬线字体、大量留白,以及有明确意图的产品图像。
这是通用的设计工具,还是 Cursor 专属的?它是专门作为 Cursor 智能体技能构建的,不是独立应用。它先用「skills」CLI 安装,然后在 Cursor 里作为斜杠命令触发。
我怎么安装和运行它?运行 npx skills add ericzakariasson/scandinavian-design,它会把技能放到 skills/scandinavian-design/。然后在你想重新设计样式的任何界面上调用 /scandinavian-design。
除了 Cursor 之外我还需要什么?只需要 Cursor 和基于 npx 的「skills」安装器;使用技能本身不需要仓库里的其他东西。仓库的 playwright-core 依赖只被内部的评估/演示脚本用到。
它总是直接重写代码,还是有时会走回退路线?那十个演示站点是使用 CSS 覆盖这种回退方式重新设计样式的,而不是总是直接重写标记——这意味着该技能在某些界面上可能会退回到 CSS 覆盖,而不是完整的代码修改。
斯堪的纳维亚风格实际看起来是什么样的?它以黑白为基调,采用无衬线字体、大量留白和有明确意图的产品图像,而不是装饰性的视觉元素。
在自己项目上尝试之前,我能先看看它的效果吗?可以。demos/ 文件夹展示了十个经过重新设计样式的真实站点,带有桌面端和移动端的前后对比截图,可以在 scandinavian-design.vercel.app 或本地浏览。
这个技能的设计判断力是怎么打磨出来的?feedback.md 记录了十个演示站点各自让这个技能学到了什么,包括过程中经过测试后被否决的设计主张。
Size
106 MB
Stars
406
Updated
CommitAug 22
Age
2mo
Commits · 90 Days