Gallery Heading

ThreeUI · Text Animation · 免费
Gallery Heading 预览

在云境TS 中打开并复制 →

内容预览

# Gallery Heading An oversized headline ringed by twelve 4:3 plates — one flat colour each, shaded by a procedural noise field rather than a gradient — that hold still until the pointer arrives, then orbit. Four galleries, each with its own field, typography, and direction. > 来源:ThreeUI Community · https://threeui.com · MIT License(Meng To / Design+Code) > 组件页:https://threeui.com/component/gallery-heading · 预览动画:https://threeui.com/previews/gallery-heading.webm > 分类:Text Animation > 包含变体(4):rising-diagonal、falling-diagonal、horizontal-sweep、vertical-loop /* ===== src/shaders/neuform-isolated/sources/gallery-heading.html (html) ===== */ New Grainient Collection Added — motion html,body{margin:0;height:100%;background:#000;overflow:hidden} body{-webkit-font-smoothing:antialiased} canvas{display:block;width:100vw;height:100vh} (function(){ 'use strict'; /* ------------------------------------------------------------------ * * Design frame: 2962 x 2160. Every length below is in that space. * ------------------------------------------------------------------ */ var DW = 2962, DH = 2160, DASP = DW / DH; var RING = { cx: 1484, cy: 1108, /* projected ring centre */ a: 712, /* projected semi-major axis (px) */ ratio: 0.492, /* semi-minor / semi-major -> plane tilt 60.5deg */ axis: 25.5, /* screen angle of the major axis (deg, y down) */ n: 12, /* tiles */ tile: 346, /* tile side in ring units (R = a) */ radius: 0.22, /* corner radius as a fraction of the side */ dist: 13, /* camera dis

……(完整源码请在站内查看)