常见webui样式及skill构建高级的web页面
豆包给出了效果示例
https://www.doubao.com/share/code/5b8a205f8796883f?is_code=1
https://www.doubao.com/share/code/49d0f7a2d5847d86?is_code=1
前端设计skill推荐
|
名称
|
frontend-design
|
|
作者
|
Anthropic
|
|
地址
|
|
|
简介
|
该 Skill 旨在创建具有 独特性 和 高设计品质 的前端界面,能够达到 生产级别 (production-grade) 的标准。它的核心目标是避免生成千篇一律、缺乏独特风格的 “AI 风格” 界面,而是通过在设计上有意地选择大胆、明确的美学方向(例如:极简、复古、未来感、野兽派等),并注重排版、色彩、动效、空间布局等细节,来打造出令人印象深刻、具有艺术感的前端页面。
|
|
资源文件
|
该 Skill 中仅包含一个 SKILL.md 文件。
|
|
应用场景
|
当你需要从零开始创建一个具体的 UI 元素时,例如一个 React 组件、一个 HTML/CSS 布局,或一个独立的静态页面。该 Skill 会确保这个组件不仅功能完善,而且在视觉上具有辨识度。
当你需要构建一个完整的应用界面时,比如一个产品的 Landing Page、一个数据仪表盘或一个小型网站。该 Skill 会从整体出发,确立一个统一且鲜明的设计风格,并将其贯彻到应用的每一个角落。
当你有一个已经存在的、但设计平庸的网页或应用,并希望提升其视觉品质时。该 Skill 会专注于美化层面的工作,通过引入独特的字体、创意的色彩方案、精致的动效和新颖的布局,来重塑界面的整体美感。
|
