How to use the Fifth Third Bank icon
import { FifthThirdBankLogo } from "@/assets/icons/fifththirdbankLogo"
export default function Example() {
return <FifthThirdBankLogo width="32px" height="32px" />
}Brands icon
Fifth Third Bank JSX Icon
Copy the Fifth Third Bank icon as an optimized JSX SVG component for React, Next.js, dashboards, landing pages and Tailwind interfaces.
ComponentFifthThirdBankLogo
FilefifththirdbankLogo.jsx
CategoryBrands
Copy-ready code
Fifth Third Bank React JSX component
// Source: https://commons.wikimedia.org/wiki/Special:PermanentLink/1252480048
// Asset license: Public domain textlogo
// Optimized, converted to monochrome currentColor JSX, and parameterized by JSXIcons.
export const FifthThirdBankLogo = ({ width = "40px", height = "40px", color = "#1D4F91", ...props }) => (
<svg {...props} width={width} height={height} viewBox="0 0 1301.4 695.74" xmlns="http://www.w3.org/2000/svg" fill={color} color={color}>
<g fill="none" fillRule="evenodd"><g fill="currentColor"><path d="M1239.117 669.524h-32.781v-78.647h32.78c22.292 0 36.06 16.384 36.06 39.324s-13.768 39.323-36.06 39.323m-3.605-104.863h-58.678V695.74h58.678c39.009 0 65.889-26.216 65.889-65.539s-26.88-65.54-65.89-65.54M1098.268 617.093H1062.1v-26.216h36.168c15.393 0 22.837 1.071 22.837 13.107 0 12.122-6.954 13.109-22.837 13.109m-65.671-52.432V695.74h29.502v-54.329h27.52l38.042 54.329h36.06l-39.666-56.644c20.571-4.483 29.323-15.672 29.323-35.141 0-27.615-15.883-39.294-55.22-39.294ZM1003.09 564.661h-29.503V695.74h29.502zM855.577 564.661h-29.503V695.74h29.503V640.5h59.005v55.24h29.502V564.66h-29.502v49.623h-59.005zM799.85 590.877h-47.532V695.74h-29.503V590.877h-47.532v-26.215h124.566zM544.16 695.74h29.502V564.662H544.16v49.622h-59.005v-49.622h-29.501V695.74h29.501V640.5h59.005zM429.428 590.877h-47.532V695.74h-29.503V590.877h-48l7.024-26.215h118.01zM274.374 614.284h-58.021v-23.408h65.233l6.884-26.215H186.85V695.74h29.503V640.5h51.137zM157.347 564.661h-29.502V695.74h29.502zM81.952 614.284H29.503v-23.407h72.117v-26.215H0V695.74h29.503V640.5h52.45z"/></g><path fill="currentColor" fillRule="nonzero" d="M409.58 0v304.173c0 69.842 56.807 126.63 126.673 126.63h356.512V126.63C892.765 56.788 835.958 0 766.092 0Z"/><path fill="currentColor" d="M429.169 19.582h336.923c58.766 0 107.085 48.302 107.085 107.048v284.59H536.253c-58.766 0-107.084-48.302-107.084-107.047z"/><path fill="currentColor" fillRule="nonzero" d="M448.757 38.511v261.745c0 49.608 40.483 90.73 90.76 90.73h314.071V129.24c0-49.608-40.483-90.73-90.76-90.73z"/><g fill="currentColor"><path d="M770.578 256.29c35.189-7.141 40.501-34.397 34.526-51.922-5.312-13.629-22.574-30.504-43.822-30.504h-80.339c31.207 10.384 39.176 36.993 39.176 36.993s12.614 36.347-35.856 46.081c0 0 29.88 12.98 35.192 36.995 7.968 36.345-38.512 46.08-38.512 46.08h78.349c37.18 0 51.787-28.558 47.141-48.028-3.984-20.12-18.59-28.555-35.855-35.696M671.129 84.855l-68.387 261.092h15.83L686.96 84.855zM580.931 256.939c21.116 0 44.87-22.888 38.932-51.497-3.961-19.712-23.053-37.512-46.85-37.512h-78.549c32.993 10.808 40.911 39.418 40.911 39.418s13.197 39.418-37.611 49.59zM608.758 90.789H494.464v59.34h114.294z"/></g></g>
</svg>
)
Built for the web
Use it in your stack
This copy-ready component works in React and Next.js projects, and the SVG can be adapted for any interface.
Looking for a similar mark? Browse the related icons below or explore the full brands collection.
Related JSX icons
FAQ
Is the Fifth Third Bank JSX icon free?
Yes. You can copy the JSX component and use it in React and Next.js projects.
Can I customize it?
Yes. Edit the SVG attributes or pass className, width, height and color props depending on the component.