An interactive web application for recognizing handwritten digits using a CNN model trained on the MNIST dataset.
Users can draw directly on a browser canvas, and the model will predict the digit in realtime.
- CNN model training on the MNIST dataset.
- Flask web application with
/predictendpoint for inference. - Interactive canvas in the browser for drawing digits.
- Realtime prediction while drawing.
- Preprocessing: cropping, scaling, and padding to make input resemble MNIST format.
-
Clone the repository
git clone https://github.com/gbennnn/realtime-digit-recognition.git cd realtime-digit-recognition -
Create a virtual environment & install dependencies
python -m venv .venv .venv\Scripts\activate # Linux/Mac: source .venv/bin/activate pip install -r requirements.txt
-
Train the model
python train_mnist.py
This script will download the MNIST dataset, train the CNN, and save the model to
models/mnist_cnn.h5. -
Run the web app
python app.py
Open your browser at
http://127.0.0.1:5000.
Simple CNN model:
- Conv2D(32, kernel 3×3, ReLU) → MaxPooling2D
- Conv2D(64, kernel 3×3, ReLU) → MaxPooling2D
- Flatten → Dense(128, ReLU) → Dropout(0.3)
- Dense(10, Softmax) for classifying digits 0–9.
Optimizer: Adam
Loss: SparseCategoricalCrossentropy
Accuracy on MNIST: ±98%.
MIT License.
Feel free to use, modify, and distribute this project.