React object rendering to fontawesome

how do i render an object to a font awesome component. i have an object with different properties and i am rendering them dynamically into my cards component so i have many cards with different contents. below is my code.

import React from "react";
import "../Styles/card.css";
import "bootstrap/dist/css/bootstrap.css";
import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
import { faCar, faTruck, faHome } from "@fortawesome/free-solid-svg-icons";

const Card = () => {
 const Cards = [
    {
      _uid: "BUY6Drn9e1",
      Icon: "faHome",
      head: "Free and Fast",
      text: "Lorem ipsum dolor sit, amet consectetur adipisicing elit. Aliquam 
tempora illum magni minima dolor id sequi quibusdam omnis.",
},
{
  _uid: "BUY6Drn9e1",
  Icon: "faTruck",
  head: "Post Transportation",
  text: "Lorem ipsum dolor sit, amet consectetur adipisicing elit. Aliquam tempora illum magni minima dolor id sequi quibusdam omnis.",
},
{
  _uid: "BUY6Drn9e1",
  Icon: "faCar",
  head: "Free and Fast",
  text: "Lorem ipsum dolor sit, amet consectetur adipisicing elit. Aliquam tempora illum magni minima dolor id sequi quibusdam omnis.",
},
  ];

  const renderCard = (Card, index) => {
const shape = Card.Icon;
console.log(shape);
return (
  <div className="card carded col mx-1 mb-2" key={index}>
    <div className="flex">
      <div className=" sameRow icon">
        {/* <i class="bi bi-truck" style={{ fontSize: 35 }}></i> */}
      </div>
      <div className="sameRow body">
        <FontAwesomeIcon
          icon={faCar}
          className="pic"
          style={{ fontSize: 25, color: "#66b2e9" }}
        />
        <h3 className="head">{Card.head}</h3>
        <p className="text">{Card.text}</p>
      </div>
    </div>
  </div>
);
};

  return <div className="row mt-5 pt-5 px-5">{Cards.map(renderCard)}</div>;
};
export default Card; 

i am trying to replace the faCar with {Card.Icon}