哈喽,大家好!
我是阿星👋
为什么AI写的风格都是大差不差、不蓝不紫呢?
1、前段时间TailwindCSS 创始人揭晓,因 AI 编码常用 Tailwind ,其 V1、V2、 默认背景为靛蓝色 ,若提示词不标 “不用蓝色和靛蓝”,AI 编码易样式雷同
所以现在一些项目的工程提示词都会加上不要使用靛蓝来避雷。
怎么破?两个方法
方法一:
最土办法:让AI直接抄源代码
1、那如果你想风格可控,你需要样式的颗粒度上规定颜色、字体、圆角、阴影、过渡等。
F12就能直接看到相关的参数,这就是你样式的基因。直接复制下来发给AI看看就ok了。让它直接照着源代码去写。
方法二:
使用三方样式网站,让AI直接用现成样式
接下来我们看看landingfolio和21st
1、langdingfolio你可以直接选详细样式
2、21st的tsx动效模板是基于固定代码的,可以防止你口述某个效果造成太大的偏差👇
都是非常重要的样式网站建议收藏起来这两个网站。
实操:
把三方网站样式代码带入ai coding
最后我们试试从21st上随便复制一段demo代码保存为两个文件。
注意每个21st的模板都是2个示例代码👇注意是两个文件不是一个。
我把这两个代码保存到本地,
然后把这两段代码作为附件连同其他提示词发给AI即可。提示词参考如下
===
帮我写一个个人主页主要呈现以下内容:
阿星AI工作室核心业务清单
核心业务板块AI智能体开发
-
电商智能助手:直播话术生成、订单自动整理、商品评价分析
-
人力资源工具:简历风险筛查、JD匹配度评分系统定制化开发
-
行业解决方案:法律/心理学案件流程等自动化管理系统
-
定制化开发:Web应用、小程序、移动APP多端同步
-
RAG系统研发与企业系统深度集成
-
大模型线上部署与微调服务企业AI培训服务
-
办公/电商等AI工作流实战教学
-
社群SOP自动化提效工作流* 自媒体风格迁移等爆款工作流
-
私域流量裂变策略(教培/餐饮行业)指导AI内容制作与传播
-
AI实战课程研发制作* 自媒体图文/短视频批量生成
-
数字化内容代运营服务AI硬件设备开发
-
实体AI交互相机
-
文旅图书馆AI导览设备
-
智能AI玩具产品
===
视觉上,参考demo.tsx
和shape-landing-hero.tsx
的代码,确保:
-
分析组件结构并识别所有必需的依赖。
-
查看组件的参数和状态。
-
识别任何必需的上下文提供者或挂钩,并安装它们。
-
如果组件需要,使用 lucide-react 图标作为 SVG 或徽标。
-
其他区块的视觉与 Hero 部分适配。
丢给cc+deepseekv3.1去写就完事了
怎么把deepseekv3.1接入cc上期已经写过了👇
戳DeepSeekV3.1+ClaudeCode丨小白5分钟写出高颜值封面生成器
效果还行
AI编程还有很多好玩的东东,每个小白都可以轻松入门~可以加入我们一起学习哦~
我是阿星,我们下期再见!