Chris Collis' Tools

A collection of standalone HTML tools.

Aspect Ratio Calculator

A web-based tool that calculates width and height dimensions while preserving a specified aspect ratio. It features a visual preview, common presets, and a copy-to-clipboard function.

Dynamic CalculationVisual PreviewPresets
Uses: Tailwind CSS (CDN), Font Awesome (CDN), Google Fonts

Modern BMI Calculator

A comprehensive health tool designed to calculate Body Mass Index with support for both Metric and Imperial systems, featuring real-time unit synchronization and visual health feedback.

Dual Unit SyncVisual GaugeHealth Advice
Uses: Tailwind CSS

Envelope PDF Generator

A standalone HTML/React tool for formatting and printing address labels on A4 envelopes. It generates a PDF with centered, left-aligned text suitable for direct printing.

Live PreviewPdf GenerationCustomization
Uses: react, react-dom, babel, tailwindcss, jspdf

Suits 'Goddamn' Soundboard

An interactive, whimsical soundboard featuring custom SVG renders of 'Suits' characters, able to say the phrase 'Goddamn'.

Custom Svg AssetsSpeech Synthesis
Uses: Tailwind CSS, Google Fonts

Jules AI Dashboard

A standalone HTML interface for the Google Jules API (v1alpha).

Session ManagementActivity TrackingRenderingAuthentication
Uses: Tailwind CSS (CDN), Google Fonts

HTML to Markdown Converter

A browser-based tool that converts rich text and HTML content into clean Markdown syntax, preserving headers, lists, links, and tables.

Rich Text InputTable ProcessingClean Conversion
Uses: Tailwind CSS, Font Awesome, Google Fonts

MAD to GBP Converter

A single-page application that provides instant currency conversion from Moroccan Dirham (MAD) to British Pounds (GBP) with a clean, responsive interface.

Real Time ConversionResponsive Ui
Uses: Tailwind CSS, Google Fonts (Inter), FlagCDN

NEON SWEEP // Tactical De-mining

A high-fidelity, sci-fi themed Minesweeper game featuring a neon-noir aesthetic, responsive grid mechanics, and persistent floating tactical controls.

Terminal InterfaceIntelligence Review ModeAdaptive Sector ProtocolTactical Chording FeedbackGhost Signal ProtocolGuaranteed Safe Start
Uses: Tailwind CSS, Google Fonts (Orbitron, JetBrains Mono)

Cell Shading Tool

Converts photos into a cell-shaded style SVG with distinct color bands and black outlines.

VectorizationShadow IntensityOutline ControlColor ClusteringMain Thread
Uses: Tailwind CSS, ImageTracer.js, Highlight.js

Vector Tool (Fine Control)

Advanced vectorization tool with fine-grained resolution control and extended path simplification ranges for ultra-abstract outputs.

VectorizationExtended SimplificationFine-Grained ResolutionMain Thread
Uses: Tailwind CSS, ImageTracer.js, Highlight.js, Cropper.js

Photo to vCard Converter

A web-based tool that uses Google's Gemini API to extract contact information from photos of business cards and generate vCard (.vcf) files.

Image ProcessingAi ExtractionVcard GenerationSettings Management
Uses: Tailwind CSS (CDN), Lucide Icons, Google Fonts

Protein Tracker Pro

A lightweight, mobile-first web application for tracking protein intake with 24-hour time formatting, persistent local storage, and validated entry editing.

Entry ManagementPersistenceSummary DashboardReporting
Uses: Tailwind CSS, Google Fonts (Inter)

UK Salary Increase Calculator

A comprehensive take-home pay comparison tool designed for the UK tax system (2023-2027), allowing users to analyze the impact of raises, pension contributions, and tax year changes on their net income.

Dynamic ComparisonTax Taper LogicMulti View BreakdownSmart InputsLocal Persistence
Uses: Tailwind CSS (CDN), Google Fonts (Inter)

Sourdough Calculator

A responsive single-page application for calculating sourdough bread ingredient weights based on target hydration and flour mass. Features 'Smart Calculation' to account for starter composition.

Smart HydrationDynamic SlidersFlour Blends
Uses: Tailwind CSS, Font Awesome, Google Fonts

Sourdough Pro Tracker

A specialized timer and progress tracker for sourdough baking that monitors the dough lifecycle and persists data across sessions.

Active Stage MonitorStage TrackingStart Time TrackingContextual CountersPersistenceCompletion Logic
Uses: Tailwind CSS, Google Fonts (Inter)

URL Encoder/Decoder

A real-time URL encoder and decoder with automatic detection of encoded content, designed for developers and power users.

Auto DetectionReal Time ProcessingResponsive Ui
Uses: Tailwind CSS, Google Fonts (Inter, JetBrains Mono)

Speech Synthesis Lab

A comprehensive playground for the Web Speech API's SpeechSynthesis interface, enabling users to experiment with system voices, speech rate, and pitch in real-time.

Voice SelectionSpeech ControlsWord TrackingAuto Play
Uses: Tailwind CSS (CDN), Google Fonts (Inter)