배경
Blob Morph
유기적 블롭들이 8값 border-radius 다중값 morph 키프레임과 느린 드리프트(translate/scale/rotate)로 젤리처럼 변형되는 CSS/SVG 배경. feTurbulence 그레인 오버레이 옵션 포함, WebGL 미사용.
- 분류
- 배경
- 난이도
- medium
- 변형
- TS-TW
설치
npx shadcn@latest add https://gasan.ai.kr/tools/effect/r/BlobMorph-TS-TW
Props
| 이름 | 타입 | 기본값 | 설명 |
|---|---|---|---|
| count | number | 4 | 블롭 개수(1~10 클램프). |
| colors | string[] | ["#C084FC","#EC4899","#5EEAD4"] | 블롭 팔레트(순환 사용). |
| background | string | #08060E | 배경(near-black) 색상. |
| blur | number | 44 | 블롭 블러 강도(px). 클수록 유기적. |
| grain | boolean | false | feTurbulence 노이즈 그레인 오버레이 사용 여부. |
| speed | number | 1 | 애니메이션 속도 계수(클수록 빠름). |
| className | string | undefined | 추가 CSS 클래스. |