Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/manish1803/3d-text
Interactive 3D text project using Three.js. Real-time rendering with dynamic animations for web graphics.
https://github.com/manish1803/3d-text
3d canvas three-js threejs vite web webgl
Last synced: 12 days ago
JSON representation
Interactive 3D text project using Three.js. Real-time rendering with dynamic animations for web graphics.
- Host: GitHub
- URL: https://github.com/manish1803/3d-text
- Owner: Manish1803
- Created: 2024-10-29T09:00:37.000Z (19 days ago)
- Default Branch: main
- Last Pushed: 2024-11-04T15:37:07.000Z (13 days ago)
- Last Synced: 2024-11-04T16:34:08.278Z (13 days ago)
- Topics: 3d, canvas, three-js, threejs, vite, web, webgl
- Language: JavaScript
- Homepage: https://manish-3d-text.vercel.app/
- Size: 2.38 MB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# 3D Text and Shapes Animation with Three.js
> A dynamic 3D scene created using Three.js to render 3D text surrounded by rotating torus shapes, with smooth camera animations using GSAP.
## Table of Contents
- [Overview](#overview)
- [Features](#features)
- [Getting Started](#getting-started)
- [Installation](#installation)
- [Usage](#usage)
- [Libraries used](#libraries-used)## Overview
This project displays animated 3D text with surrounding torus shapes, providing an interactive and visually engaging experience. It leverages [Three.js](https://threejs.org/) for 3D rendering and [GSAP](https://greensock.com/gsap/) for smooth animations.
## Features
- 3D text generated with custom fonts
- Surrounding 3D torus shapes with random positions, rotations, and scales
- Smooth camera animation using GSAP
- Responsive and fullscreen support
- Interactive orbit controls for user manipulation## Getting Started
### Prerequisites
Ensure you have [Node.js](https://nodejs.org/) installed on your machine.
### Installation
1. Clone this repository:
```bash
git clone https://github.com/yourusername/your-repo-name.git
cd your-repo-name
```2. Install dependencies:
```bash
npm install
```3. Run the project:
```bash
npm run dev
```## Libraries Used
- `Three.js` - For 3D rendering
- `GSAP` - For animations