⧉구성·조합

레이어 순서, 블렌드 모드, 마스크, 움직이는 값(동적 props), 그룹 — 컴포넌트를 겹쳐 하나의 효과로 만드는 규칙. — 6개 항목

WebGPU 를 지원하는 브라우저에서 움직입니다

이 기기에서는 데모를 그리지 못해 정지 화면을 보여 줍니다

여러 셰이더 레이어를 한 컨테이너에 묶어 함께 배치하는 구성 요소입니다.

WebGPU 를 지원하는 브라우저에서 움직입니다

이 기기에서는 데모를 그리지 못해 정지 화면을 보여 줍니다

레이어는 아래에서 위 순서로 그려지고, 효과는 앞서 그린 레이어에 적용됩니다.

WebGPU 를 지원하는 브라우저에서 움직입니다

이 기기에서는 데모를 그리지 못해 정지 화면을 보여 줍니다

블렌드 모드는 위 레이어의 색을 아래 레이어의 색과 섞는 규칙입니다.

WebGPU 를 지원하는 브라우저에서 움직입니다

이 기기에서는 데모를 그리지 못해 정지 화면을 보여 줍니다

다른 레이어의 투명도나 밝기를 읽어 이미지가 보일 영역을 제한합니다.

WebGPU 를 지원하는 브라우저에서 움직입니다

이 기기에서는 데모를 그리지 못해 정지 화면을 보여 줍니다

애니메이션·포인터 위치·다른 레이어 값으로 셰이더 props를 프레임마다 바꿉니다.

WebGPU 를 지원하는 브라우저에서 움직입니다

이 기기에서는 데모를 그리지 못해 정지 화면을 보여 줍니다

기본 컴포넌트로 표현하기 어려운 픽셀 효과를 `defineShader`로 직접 정의합니다.