CSS 2024+
View Transitions API
Native, GPU paātrinātas pārejes starp sadaļām. Noklikšķini navigācijā — redzēsi gludu fade + blur efektu.
2026 · Liquid Glass · View Transitions
Radām digitālo nākotni
View Transitions API, CSS scroll-driven animācijas un Liquid Glass efekts — jaunākās 2026 web tehnoloģijas vienā lapā.
0
%
Performance
0
fps
Animācijas
0
%
Responsive
2026 Jaunumi
Nākotnes web standarti
Trīs tehnoloģijas, kas šobrīd definē premium web pieredzi.
CSS 2024+
Scroll-Driven Animations
Animācijas, kas saistītas ar scroll pozīciju — bez JavaScript. Progress josla augšā un elementu parādīšanās ritmā ar lapu.
Design 2025–26
Liquid Glass
Šķidrs stikla efekts ar refrakciju, spīdumu un OKLCH krāsām. Hero panelis reaģē uz peles kustību.
Funkcijas
Viss, kas nepieciešams
Viss, kas nepieciešams
modernam web projektam
3D & WebGL
Three.js Torus Knot, Icosahedron un orbitējoši objekti. Reaģē uz peli un scroll.
Bento Grid
2025–2026 dizaina standarts — asimetrisks, vizuāli bagāts izkārtojums.
Reāllaika
Canvas daļiņu sistēma un smooth scroll ar requestAnimationFrame.
Pieejamība & Performance
Semantic HTML, ARIA atribūti, prefers-reduced-motion atbalsts un optimizētas animācijas.
Liquid Glass
Šķidrs stikls ar backdrop blur, OKLCH krāsām un interaktīvu spīdumu.
3D Showcase
Interaktīvi 3D objekti
Three.js ar MeshPhysicalMaterial — metālisks spīdums, emisija un reāllaika apgaismojums.
Torus Knot
Stack
Tehnoloģiju steks
View Transitions
Native pārejes · ::view-transition · navigation: auto
Scroll-Driven
animation-timeline: view() · scroll() · OKLCH
Three.js
WebGL · MeshPhysicalMaterial · TorusKnot · Icosahedron
CSS
OKLCH · @layer · Liquid Glass · Container Queries
JavaScript
ES Modules · Three.js · Intersection Observer · Canvas API
HTML5
Semantic · ARIA · Viewport Meta · color-scheme
Performance
GPU layers · will-change · font-display: swap
Interaktīvs
Mēģini pats
preview.html
Gatavs radīt kaut ko
lielisku?
Šī demo lapa ir sākumpunkts. Pielāgo, paplašini un veido savu digitālo produktu.