배경
Kaleidoscope
극좌표 각도 폴딩과 거울 반사로 만화경처럼 방사형 대칭 무늬를 만드는 WebGL 셰이더 배경. 세그먼트 폭으로 각도를 모듈로 폴딩한 뒤 조각 내부를 다시 거울 반사(삼각파)해 N개 거울 조각의 대칭을 만들고, 폴딩된 극좌표로 표준 value 노이즈 기반 fbm 패턴을 채운다. 통 회전과 도메인 워핑으로 무늬가 유동적으로 흐른다.
- 분류
- 배경
- 난이도
- hard
- 변형
- TS-TW
설치
npx shadcn@latest add https://gasan.ai.kr/tools/effect/r/Kaleidoscope-TS-TW
Props
| 이름 | 타입 | 기본값 | 설명 |
|---|---|---|---|
| colorA | string | #C084FC | 반사 무늬의 밝은 결 색(중심에서 살아나는 하이라이트). |
| colorB | string | #EC4899 | 반사 무늬의 대비 색(각 조각의 다른 결). |
| colorBg | string | #08060E | 배경 근-블랙(만화경 통 안쪽의 어두운 바탕). |
| segments | number | 8 | 반사 조각(거울) 개수. 값이 클수록 촘촘한 대칭. |
| scale | number | 2.4 | 노이즈 패턴의 촘촘함(값이 클수록 잔무늬 증가). |
| speed | number | 1.0 | 회전/유동 속도. |
| className | string | undefined | 컨테이너에 전달할 선택적 CSS 클래스. |