In my React app I'm trying to display an image in the project's directory. In the browser that image is being displayed as the Google Chrome default image when a file cannot be found. Could someone tell me if I'm importing my image correctly?

Component trying to render the image:

import React from "react";
import "../css/navbar.css";

export default function Navbar() {
    return (
        <div className="navbar-container">
            <img src="../images/logo.png" className="logo" />
        </div>
    );
}

What I'm seeing: