GitHunt
VI

ViratiAkiraNandhanReddy/404-silk-bg-three.js

A beautiful, responsive 404 error page with an animated silk-like background powered by Three.js and custom shaders. Built with modern HTML, CSS, and WebGL for smooth visuals and fluid performance.

GitHub Pages Repo Size Visits Issues Stars

404-silk-bg-three.js

A beautiful, responsive 404 error page featuring an animated silk-like background powered by Three.js shaders.


Features

  • ๐ŸŽจ Smooth animated silk-like background with auto-cycling colors
  • ๐Ÿ“ฑ Fully responsive design
  • โšก Optimized WebGL rendering
  • ๐ŸŽฏ Clean, modern UI
  • โ™ฟ Accessible error messaging

๐Ÿ“ธ Preview

Desktop View

Desktop

Mobile View

Mobile


Technologies

  • Three.js - 3D graphics library for WebGL rendering
  • Custom Shaders - Fragment shader for silk-like animation effect
  • Responsive CSS - Flexible layout with clamp() for scaling

Browser Support

Requires a modern browser with WebGL support:

  • Chrome/Edge 60+
  • Firefox 55+
  • Safari 15+

Usage

Deploy the files to your server and configure your 404 error page to point to index.html.


Customization

Edit values in three.js to customize:

  • uSpeed - Animation speed (default: 0.5)
  • uScale - Pattern scale (default: 1.0)
  • uNoiseIntensity - Noise effect strength (default: 1.5)
  • Hue cycle speed in the animate() function (multiply 0.05 value)

Performance

  • Limits device pixel ratio to 2 for better performance
  • Uses OrthographicCamera for efficient 2D rendering
  • Antialiasing enabled for smooth visuals

๐Ÿค Contributing

Pull requests are welcome!

To contribute:

  1. Fork the repository
  2. Create a new branch
  3. Add your changes
  4. Open a PR

โญ Support

If you like this project, consider giving it a star โญ on GitHub โ€” it helps a lot.


LinkedIn
X
Instagram
Facebook
Gist
YouTube
Website
Mail


๐Ÿ“ License

ยฉ 2025 ViratiAkiraNandhanReddy. This project is licensed under the MIT License.


๐Ÿ‘ค Author

Developed by ViratiAkiraNandhanReddy

๐Ÿ’ค - PASSIVE MAINTENANCE : Mean the project is no longer actively developed ( NO New Features And Regular Updates ), but the maintainer will respond only when an issue or PR is raised. Feel free to fork and continue development!


๐ŸŒŸ Questions, suggestions, or want to contribute? Open an issue or pull request on GitHub! ๐ŸŒŸ