ToolsAreCool: WebGL-Powered Privacy Utilities

High-performance tools for finance, calculators and security. Built with Nuxt 3 and Three.js, everything runs 100% client-side in your RAM. Fast, private, and zero data retention.

Comment

🛡️ Inspiration

Most web utilities today are a privacy nightmare. To perform a simple task like extracting emails or calculating a loan, users are often forced to upload sensitive data to a server. I wanted to build a "Swiss Army Knife" for the web that was fast, beautiful, and fundamentally private.

🚀 What it does

ToolsAreCool is a directory of tools across five major categories:

  • Finance: Loan, Retirement, and Compound Interest calculators with dynamic visuals.
  • Text & SEO: Keyword density analyzers, readability scores, and extraction tools.
  • Security: SHA/MD5/CRC generators and secure password tools.
  • Content Creation: YouTube and Influencer earnings estimators.
  • Everyday Tools: Health (BMI), fuel cost, and download time calculators.

The Privacy Core: Every single tool operates 100% client-side. Whether you are hashing a password or calculating debt, the logic stays in your browser’s RAM. No databases, no logs, no data retention.

🛠️ How I built it

I spent 6 months architecting this as a high-performance Nuxt 3 application:

  • Frontend: Built with Vue 3.5 and TypeScript for a reactive, type-safe experience.
  • Visuals: Integrated Three.js and pure WebGL to create an immersive Hero section.
  • Motion: Used @vueuse/motion for fluid, app-like UI transitions.
  • Data Vis: Chart.js & vue-chartjs for real-time, reactive financial projections.

🧠 Challenges I ran into

The biggest hurdle was managing the bundle size. Integrating Three.js into a Nuxt 3 lifecycle while maintaining high Lighthouse scores required aggressive code-splitting and lazy-loading. Ensuring that more different tools shared a consistent logic layer while remaining modular was a significant architectural challenge.

🏆 Accomplishments that I'm proud of

I successfully built a suite where the "cool" factor (WebGL/Animations) doesn't compromise the "utility" factor. Achieving sub-millisecond processing times for complex text analysis—entirely without a backend—is a major win for user privacy.

📖 What I learned

This project deepened my expertise in Vue 3.5’s reactivity system and browser-based cryptography. I learned how to handle heavy 3D graphics in a way that remains SEO-friendly and accessible.

🔮 What's next for ToolsAreCool

I plan to expand the suite to 100+ tools, including developer-specific utilities.

Built With

Share this project:

Updates