skill-gallery

Claude Code + frontend-ui-engineering · 数据看板

下载 HTML run.json

沙箱预览:页面的脚本会运行,但页面无法访问本站、cookie 或存储,所以依赖 localStorage 的功能可能表现不同。

滚动录屏

页面在桌面宽度下滚动的录屏,用来展示截图看不到的动效。点了播放才会加载视频。

▶ 播放滚动录屏 8 秒 · 962 KB · 720 px

无障碍扫描

对原始页面做的自动化扫描。自动化工具只能发现一部分无障碍问题,扫描结果干净并不代表页面就是无障碍的。

工具
axe-core 4.14.0
严重
0 条规则
较严重
0 条规则
中等
1 条规则 · 1 个元素
轻微
0 条规则
触发的规则
landmark-unique

投票

觉得这个结果更好?在下面点 👍。投票需要登录 GitHub。票数以 reaction 的形式存在本仓库的 GitHub Discussions 里,每格一个讨论帖,所有语言共用。

👍 0 截至上次构建,每几个小时更新一次

运行详情

状态
成功
Agent
claude-code 2.1.308
模型
claude-opus-5-5
Effort
high
题目
dashboard v1
Skill 附加句
Use the frontend-ui-engineering skill.
Skill 来源
https://github.com/addyosmani/agent-skills skills/frontend-ui-engineering
Skill commit
aeac41d4d0
Skill 获取方式
git, 2026-10-26
安装位置
.claude/skills/frontend-ui-engineering
Skill 是否触发
是
证据
skill_tool_calls: 1, skill_content_loaded: 1, skill_md_reads: 0
用到的内置 skill
无
开始时间
2026-10-26 06:24:24Z
耗时
9m 27s
退出状态
退出码 0
尝试次数
1
Token
input_tokens: 30, cache_creation_input_tokens: 76,137, cache_read_input_tokens: 972,228, output_tokens: 57,778
轮数
20
费用
$1.96
活动
Skill 1, Bash 10, Write 1, Read 4
隔离
全部检查通过
  • ✓ init_event_present
  • ✓ only_builtin_plugins
  • ✓ no_synced_plugins
  • ✓ no_mcp_servers
  • ✓ no_plugin_skills
  • ✓ config_dir_was_empty
  • ✓ home_had_only_throwaway_keychain
  • ✓ real_keychain_unchanged
  • ✓ auto_memory_disabled
  • ✓ skill_listed
外部引用
  • https://fonts.googleapis.com link[rel=preconnect]
  • https://fonts.gstatic.com link[rel=preconnect]
  • https://fonts.googleapis.com/css2?family=Fraunces:opsz,wght@9..144,600&family=IBM+Plex+Sans:wght@400;500;600&display=swap link[rel=stylesheet]
对 index.html 的静态扫描结果,来自 run.json。
违反规则
无
输出
index.html, 63.0 KB
截图(桌面)
1440×900, 页面高 1649 px, 3 个远程请求
截图(手机)
390×844, 页面高 3443 px, 3 个远程请求
主机
Darwin 25.6.0, arm64, node v22.18.0