W E B G L G A L L E R Y

WebGL 表現の参考集

フルスクリーン三角形を1枚描き、フラグメントシェーダで全面を塗る——同じ土台のまま、 波形・流体・空間系まで13パターン。各デモはマウスに反応します。

B A S E C O L L E C T I O NWEBGL 表現の基本10パターン
01
共鳴フィールド
RESONANCE FIELD
fbm / domain warp
02
オーロラ膜
AURORA
fbm / domain warp
03
流体メタボール
METABALLS
raymarch / SDF
04
スターフィールド・ワープ
STARFIELD WARP
空間系 / radial depth
05
無限トンネル
INFINITE TUNNEL
空間系 / polar mapping
06
水面リップル
WATER RIPPLES
height field / normal
07
星雲
VOLUMETRIC NEBULA
空間系 / volumetric
08
地形フライト
TERRAIN FLIGHT
空間系 / heightfield
09
結晶セル
VORONOI CELLS
voronoi (F2-F1)
10
回転ジオメトリ
ROTATING GEM
空間系 / raymarch
M A D E W I T H S A K A N A A ISakana AI で生成した3パターン
sakana100
流体リーフ
FLUID REEF
flow field / school SDF
sakana101
軌道格子コア
ORBITAL LATTICE
raymarch / lattice SDF
sakana102
時空鯉渦
KOI VORTEX
polar repeat / glow
WebGL 1.0 / フラグメントシェーダ ・ ライブラリ不使用 ・ prefers-reduced-motion 対応