HomeProfile.js

import { Link } from "react-router-dom";

const HomeProfile = () => {
  const id = 1;
  return (
    <Link to={`/profile/${id}`} className="text-decoration-none text-dark">
      <form className="flex-column align-items-center justify-content-center m-2">
        <div className="d-flex justify-content-center">
          <img
            src="cherry.jpg"
            className="rounded-circle"
            style={{
              width: "157px",
              height: "157px",
              borderStyle: "solid",
              borderColor: "#262626",
            }}
          />
        </div>
        <h1 className="d-flex justify-content-center"> CHERRY </h1>
        <h2 className="d-flex justify-content-center"> #0805 </h2>
      </form>
      <div
        style={{ backgroundColor: "#262626", width: "auto", height: "2px" }}
      />
    </Link>
  );
};

export default HomeProfile;