My CNN does not correctly predict images that are not from the dataset

I want my CNN to predict numbers that I draw with the mouse. LA CNN works fine with the dataset and test images but fails with drawn numbers. I think it may be a problem when rescaling the images I drew but I can't find a solution.

The CNN:

from tensorflow.keras import layers
from tensorflow.keras import models
from tensorflow.keras.datasets import mnist
from tensorflow.keras.utils import  to_categorical
from keras import backend as K


K.set_value(model.optimizer.learning_rate, 0.001)


(train_images, train_labels), (test_images,test_labels) = mnist.load_data()
train_images = train_images.reshape((60000, 28, 28, 1))
train_images = train_images.astype("float32")/255

test_images = test_images.reshape((10000, 28, 28, 1))
test_images = test_images.astype("float32")/255

train_labels = to_categorical(train_labels)
test_labels = to_categorical(test_labels)



model=models.Sequential()
model.add(layers.Conv2D(6,(5,5),activation="tanh",input_shape=(28,28,1)))
model.add(layers.MaxPooling2D(2,2))
model.add(layers.Conv2D(16,(5,5),activation="tanh"))
model.add(layers.MaxPooling2D(2,2))
model.add(layers.Conv2D(120,(4,4),activation="tanh"))
model.add(layers.Flatten())
model.add(layers.Dense(64,activation="tanh"))
model.add(layers.Dense(10,activation="softmax"))

optimizer = keras.optimizers.Adam(lr=0.01)

model.compile(optimizer="rmsprop", loss="categorical_crossentropy", metrics=["accuracy"])

model.fit(train_images, train_labels, epochs=5, batch_size=64)


test_loss, test_acc = model.evaluate(test_images,test_labels)



model_json = model.to_json()
with open("model.json", "w") as json_file:
    json_file.write(model_json)
# serializar los pesos a HDF5
model.save_weights("model.h5")
print("Modelo Guardado!")

The script where I draw the number and try to predict it

import sys
from tkinter import *
from PIL import Image, ImageDraw
from keras.models import model_from_json
import keras.utils as image
import numpy as np

drawing_area=""
w=50
h=50
x,y=None,None
count=0
image_count=0
image_name="numero"
pil_image=Image.new("1",(w,h),"white")
draw=ImageDraw.Draw(pil_image)

#CARGAMOS EL MODELO

json_file = open('model.json', 'r')
loaded_model_json = json_file.read()
json_file.close()
loaded_model = model_from_json(loaded_model_json)
loaded_model.load_weights("model.h5")
print("Cargado modelo desde disco.")
loaded_model.compile(loss='mean_squared_error', optimizer='adam', metrics=['binary_accuracy'])

def graficar(event):
    global drawing_area,x,y,count,draw
    newx, newy= event.x, event.y
    if x is None:
        x,y=newx, newy
        return
    count+=1
    sys.stdout.write("revent count %d" %count)
    drawing_area.create_line((x,y,newx,newy),width=5,smooth=True)
    draw.line((x,y,newx,newy),width=10)
    x,y=newx,newy

def graficar_finalizar(event):
    global x,y
    x,y=None, None


def salir(event):
    sys.exit()


def predecir(event):
    global pil_image, image_name, image_count
    image_count +=1
    file_name = image_name+str(image_count)+".jpg"
    pil_image = pil_image.resize((28,28),Image.Resampling.LANCZOS)
    pil_image.save(file_name)

    img = image.load_img(file_name,color_mode="grayscale")

    img = image.img_to_array(img)
    img = np.expand_dims(img, axis=0)

    img = np.vstack(
)
    classes = loaded_model.predict(img)
    print(np.argmax(classes))




def limpiar(event):
    global drawing_area, pil_image, draw
    drawing_area.delete("all")
    pil_image=Image.new("1",(w,h),"white")
    draw=ImageDraw.Draw(pil_image)



def main():
    global drawing_area
    win=Tk()
    win.title("Lienzo")
    drawing_area=Canvas(win,width=w,height=h,bg="white")
    drawing_area.bind("<B1-Motion>",graficar)
    drawing_area.bind("<ButtonRelease-1>",graficar_finalizar)
    drawing_area.pack()

    b1=Button(win,text="Predecir",bg="white")
    b1.pack()
    b1.bind("<Button-1>",predecir)

    b2=Button(win,text="Limpiar",bg="white")
    b2.pack()
    b2.bind("<Button-1>",limpiar)

    b3 = Button(win, text="Cerrar", bg="white")
    b3.pack()
    b3.bind("<Button-1>", salir)




    win.mainloop()

if __name__=="__main__":
    main()

I have tried changing the canvas dimensions or changing the CNN learning rate

You need to make two minor changes in your code.

Firstly, you need to have a look at the images that the model has been trained on, and you must try to recreate images similar to the ones that the model has been trained on. The images in the mnist dataset have a black background where the digit is represented in white.

The image that is being drawn in your applet has a white background with the digit in black. You need to add a line img = 255-img inside your predicir function. Here's an example:

def predecir(event):
    global pil_image, image_name, image_count
    image_count +=1
    file_name = image_name+str(image_count)+".jpg"
    pil_image = pil_image.resize((28,28),Image.Resampling.LANCZOS)
    pil_image.save(file_name)

    img = image.load_img(file_name,color_mode="grayscale")

    img = image.img_to_array(img)
    img = 255-img
    img = np.expand_dims(img, axis=0)

    img = np.vstack(
)
    classes = loaded_model.predict(img)
    print(np.argmax(classes))

Secondly, you would have also observed that the digits that were being drawn in your applet look somewhat thicker than the ones in the dataset. You can try reducing the width of the drawing_area.create_line inside the graficar function from 5 to (say, 1 or 2). Here:

def graficar(event):
    global drawing_area,x,y,count,draw
    newx, newy= event.x, event.y
    if x is None:
        x,y=newx, newy
        return
    count+=1
    sys.stdout.write("revent count %d" %count)
    drawing_area.create_line((x,y,newx,newy),width=1,smooth=True)
    draw.line((x,y,newx,newy),width=10)
    x,y=newx,newy

After incorporating these changes, your code is working as expected.
As an example below, I've shown it for the number 7 (please pardon my drawing skills).