HTML Tools Suite
1,088+ pure front-end online tools. Single-file HTML, offline-ready, privacy-first. Covers Dev, Text, Time, Generators, Media, Calculators, Converters, Security.
Open the official app on tools.realtime-ai.chat
This tool is hosted by its maintainers. Click below to open tools.realtime-ai.chat in a new tab — it's their official demo.
Browse calculators tools →What's next with HTML Tools Suite?
Choose how you want to get started.
Use it free
Open the official tool or demo — no account needed.
Self-host it
Run the open-source version on your own infrastructure.
What is HTML Tools Suite?
HTML Tools Suite (also referred to as WebUtils) is an open-source project hosted on GitHub and distributed under the MIT license with 130 stars, accessible via GitHub Pages, Cloudflare Pages, Vercel, Render, Surge, Netlify, and custom domains like tools.realtime-ai.chat. It provides a massive collection of 1088+ browser-based tools designed to solve everyday developer, time, and media tasks without requiring server uploads or heavy framework overhead. The suite features 100% local processing where data is never uploaded to a server, offline usability simply by downloading the HTML, a single-file architecture requiring no npm or webpack builds to get started, and extremely fast loading speeds due to the absence of heavy framework overhead like React or Vue. Included tools span multiple categories such as dev tools (JSON formatting with syntax highlighters and error locators, regex testers with real-time matching and capture group display, JWT decoders for one-click token parsing, and Base64 encoding for text and files), time tools (multi-timezone timestamp conversion, visual Cron expression parsing, and date calculation), and media/generator tools (local image compression, customizable QR code generation, and tools across categories like text, privacy, security, network, calculator, extractor, and AI).
How it works
HTML Tools Suite is an open-source MIT-licensed project built using pure front-end web technologies (HTML, CSS, and JavaScript) structured around a single-file architecture. It avoids heavy framework overhead like React or Vue to maintain extreme load speeds. The codebase utilizes a shared source base comprising tool-base.css and tool-chrome.js to prevent redundant maintenance across more than 1000 tool pages. Standalone deployment scripts (npm run export:standalone) handle the inlining of local shared resources. Third-party library dependencies leverage external CDNs including cdnjs, unpkg, and jsdelivr. State management relies on URL hashes for saving and restoring user state. The development workflow incorporates tools.json metadata tracking, automated synchronization scripts (npm run sync:tools), and strict linting enforcement via HTMLHint, Stylelint, and ESLint.
How to use it
- 1Access the tools suite via the custom domain at https://tools.realtime-ai.chat or via alternative deployment platforms such as GitHub Pages, Cloudflare Pages, Vercel, Render, or Surge. Alternatively, download the HTML to use the tools completely offline. 2. Navigate through the 1088+ available tools categorized under dev, text, time, generator, privacy, media, security, network, calculator, extractor, and AI. 3. Select a specific utility such as the JSON formatter for syntax highlighting and error localization, the regex tester for real-time matching and capture group display, or the JWT decoder for one-click token parsing. 4. Process text, files, images, timestamps, or Cron expressions locally in your browser with zero data uploaded to external servers. 5. If contributing new tools, place them in the appropriate tools/ category directory (dev/text/time/generator/privacy/media/security/network/calculator/extractor/ai), update tools.json with path, name, category, and keywords metadata, run npm run sync:tools to sync with index.html, update the README.md tool list, and execute npm run lint to ensure code compliance.
What it can do
- Conversion
- AI Tools
Use cases
Assumptions and limitations
Assumptions
- source: https://github.com/chicogong/html-tools
- license: MIT — free to use
- privacy: Opens an external demo
Limitations
- Netlify deployment is currently paused as indicated by the status marker in the project documentation.
- The tools suite relies on CDN dependencies (such as cdnjs, unpkg, or jsdelivr) when third-party libraries are needed for specific tools.
- Code contributions and new tool additions strictly require adherence to automated linting rules (HTMLHint, Stylelint, ESLint) and Conventional Commits standards to pass CI checks.
Understanding the result
1,088+ pure front-end online tools. Single-file HTML, offline-ready, privacy-first. Covers Dev, Text, Time, Generators, Media, Calculators, Converters, Security, Network, AI.
Tool details
- Clearly flagged when a network request is needed.
- No account, no sign-up, and no tracking of your content.
- Powered by html-tools (MIT).
- Built with
- html-tools (chicogong/html-tools)
- License
- MIT
- Runs locally
- No — requires a network request
- Verification
- Not yet verified
- Input
- URL Text, Plain Text
- Output
- HTML
Built with chicogong/html-tools. OpenToolVault provides the discovery and browser interface while crediting the original project maintainers.
- Built with
- html-tools
- License
- MIT
Open-source project
OpenToolVault is an independent directory. We are not affiliated with or endorsed by this project.
References
- chicogong/html-tools — GitHub Repository
Upstream project · GitHub
- MIT License
Upstream project
Frequently asked
How do I add a new tool to the HTML Tools Suite repository?
You can add a new tool by choosing an appropriate category directory under tools/ (such as dev, text, time, generator, privacy, media, security, network, calculator, extractor, or ai), adding the tool metadata to tools.json including path, name, category, and keywords, running npm run sync:tools to sync to index.html, updating the README.md tool list, and running npm run lint to verify code规范.
What happens during the CI sync check if tools.json and index.html do not match?
The build will automatically fail if the CI check detects an inconsistency between tools.json and index.html. You must run npm run sync:tools to keep them synchronized.
How can I export a tool as a standalone file for distribution?
You can use the command npm run export:standalone to inline local shared resources when you need to distribute or export a single file.
How does HTML Tools Suite differ from other online tool websites regarding performance and architecture?
Unlike other tool sites that typically host 50 to 80 tools, require npm/webpack builds, upload data to servers, and suffer slower load times due to React or Vue framework overhead, HTML Tools Suite provides 1088+ tools with a single-file architecture, zero framework overhead, 100% local browser processing, and complete offline capability by simply downloading the HTML.
What formatting and linting rules are enforced during code contributions?
Contributions are checked automatically via CI using HTMLHint for HTML files, Stylelint for CSS files, and ESLint for JS files. Code must also use 2-space indentation, Chinese comments with English code, and follow Conventional Commits formats (feat, fix, docs, style, refactor, perf, test, chore).?