# 图片粒子网页特效｜预览与使用提示词 - Creght

> 将图标与轮廓采样成粒子，给品牌标志一个有呼吸感的出场。

[跳到主要内容](#particle-main)

[![Creght](https://ugc.talizen.com/_assets/site/2061660904709165056/1780797461299__creght_logo.png)](/)

产品

[AI 建站推荐用对话生成网站与 Web 应用](/ai.md) [可视化建站用画布、组件和特效精细搭建](/design.md)

[两种方式对比根据需求选择合适的创作方式](/ai-vs-visual-builder.md)

核心能力

[AI 生成](/ai.md) [可视化编辑](/features/visual-editing.md) [后端能力](/features/backend.md) [发布与托管](/features/publishing.md) [SEO、GEO 与数据](/features/analytics.md) [Creght CLI](/features/cli.md) [全部能力](/features.md)

解决方案

[SaaS 官网生成器](/saas-website-builder.md) [设计师作品集](/solution/designer-portfolio.md) [外贸独立站](/solution/foreign-trade-website.md)

[价格](/price.md) [帮助中心](/help.md)

[资源广场](/resources.md)

Creght AI·建站资源

[网站模板从完整网站开始](/templates.md) [页面区块首屏、定价、案例等常用区块](/blocks.md) [动效灵感发现可复用的交互动效](/effects.md)

[浏览全部资源](/resources.md) [可视化建站资源](/design/resources.md)

[联系我们](/contact.md)

[立即体验](https://creght.cn/project)

[动效库](/effects.md)/ [粒子特效与 Hero](/effects/particle.md)/图片粒子

独立动效 / PARTICLE

# 图片粒子

将图标与轮廓采样成粒子，给品牌标志一个有呼吸感的出场。

![图片粒子动态画布的静态封面](https://fsu.creght.com/site/2066727200882692096/1788856511008__image_particles_cover.png?w=3072&fmt=webp)

当前使用静态预览。你可以自行开启动态效果。

播放动态效果

预览参数

暂停恢复默认

速度1.0粒子大小1.3光晕0.8主色

参数只影响本次预览，不会保存到资源库。手机自动降低粒子数量。

## 把这个效果用起来

复制提示词，在 Creght AI 中描述你的品牌、内容和放置位置。这个资源可以作为完整网站的一部分。

复制 Prompt [免费生成网站](https://creght.cn/ai?utm_source=resource_library&utm_medium=website&utm_campaign=particle&utm_content=image-particles)

先复制，再粘贴到 Creght AI 对话中，描述你想放置的位置。

[← 返回粒子资源库](/effects/particle.md)

## 关于这个资源

## 从轮廓到微光

演示将一枚公开示例星形图标采样成粒子，保留图像色彩。它适合简洁 Logo、产品符号与高对比轮廓，细节复杂的照片未必容易辨认。

## 准备图片

建议使用透明背景、清晰轮廓的素材。CMS 中的示例图必须允许跨域采样；拥有素材使用权后再上传，避免依赖无法读取的第三方链接。

## 性能与降级

图像采样在详情加载后进行。图像无法读取或 WebGL 不可用时保留静态封面，不影响文字说明与 CTA。

## 你的建站起点

```
为一个 图片粒子 风格的产品官网创建粒子 Hero。使用深色 #03090e 背景、#a9dbff 蓝色与 #ffa66b 金色点缀，模式 image，默认约 12000 粒子，速度 1，粒子大小 1.3，光晕 0.8。使用 https://fsu.creght.com/site/2066727200882692096/1788850063911__particle_sample.svg 作为可跨域采样的示例图，保留图片颜色。 在画布之外添加品牌标题、产品价值说明与明确 CTA，再扩展导航、功能介绍、案例和联系区。手机端降低粒子数量；支持减少动效、手动暂停、离屏暂停与 WebGL 失败时静态降级。此提示词用于描述效果，不是模板源码导入；请根据实际结果继续调整。
```

提示词保留在页面中，可手动选择复制。预览中的临时调参不会自动改写这里的提示词。

## 继续探索

[查看全部 →](/effects/particle.md)

[![星际螺旋动态画布的静态封面](https://fsu.creght.com/site/2066727200882692096/1788856431173__stellar_spiral_cover.png?w=3072&fmt=webp)预览效果](/effects/particle/stellar-spiral.md)

### [星际螺旋](/effects/particle/stellar-spiral.md)

独立动效

蓝金色星光沿旋臂汇聚，为 AI 产品与科技官网建立空间感。

[![旋涡星系动态画布的静态封面](https://fsu.creght.com/site/2066727200882692096/1788856448263__galaxy_cover.png?w=3072&fmt=webp)预览效果](/effects/particle/galaxy.md)

### [旋涡星系](/effects/particle/galaxy.md)

独立动效

倾斜的星系盘与柔和流光，适合需要沉浸感的产品发布页。

[![文字粒子动态画布的静态封面](https://fsu.creght.com/site/2066727200882692096/1788856471911__text_particles_cover.png?w=3072&fmt=webp)预览效果](/effects/particle/text-particles.md)

### [文字粒子](/effects/particle/text-particles.md)

独立动效

把品牌名或一句宣言变成发光粒子，适合新品发布与创意作品集。

![Creght](https://ugc.talizen.com/_assets/site/2061660904709165056/1780797461299__creght_logo.png)

此网站使用 [Creght](/) 创建

![微信客服](https://fsu.creght.com/site/2066727200882692096/1785119134612__image.png?w=3072&fmt=webp)

微信客服

## 链接

- [SaaS 官网生成器](/saas-website-builder.md)
- [价格](/price.md)
- [解决方案](/solution.md)
- [客户案例](/customers.md)
- [AI 模型对比](/ai-models.md)
- [帮助中心](/help.md)
- [联系我们](/contact.md)
- [更新记录 & 博客](/blogs.md)
- [退款说明](/tuikuan.md)

## 资源

- [全部资源](/resources.md)
- [模板](/templates.md)
- [组件库](https://creghtlib.site.creght.com)
- [动效库](/design/effects.md)
- [Figma to Creght](/figma2creght.md)
- [API](/api.md)

## 产品对比

- [对比上线了](/creght-vs-sxl.md)
- [对比凡科建站](/creght-vs-fkw.md)
- [自己写代码 vs Creght](/compare/self-coding.md)
- [外包 vs 自己做](/compare/outsourcing.md)

## 协议

- [用户协议](/legal/terms.md)
- [隐私政策](/legal/privacy.md)
- [可接受使用政策](/legal/acceptable-use.md)

## 社交媒体

- [小红书](https://www.xiaohongshu.com/user/profile/5a38606811be10715f4895b6)
- [哔哩哔哩](https://space.bilibili.com/513308095)

[蜀ICP备2023038192号-2](https://beian.miit.gov.cn)

免费方案评估

> 全站页面清单：[/llms.txt](/llms.txt)