How to use the Rakuten icon
import { RakutenLogo } from "@/assets/icons/rakutenLogo"
export default function Example() {
return <RakutenLogo width="32px" height="32px" />
}E-commerce icon
Rakuten JSX Icon
Copy the Rakuten icon as an optimized JSX SVG component for React, Next.js, dashboards, landing pages and Tailwind interfaces.
ComponentRakutenLogo
FilerakutenLogo.jsx
CategoryE-commerce
Copy-ready code
Rakuten React JSX component
// Source: https://raw.githubusercontent.com/simple-icons/simple-icons/develop/icons/rakuten.svg
// Asset license: Simple Icons CC0 1.0 Universal. Brand names and marks remain trademarks of their respective owners.
export const RakutenLogo = ({ width = "40px", height = "40px", color = "#BF0000", ...props }) => (
<svg {...props} width={width} height={height} viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" fill={color}>
<path d="M23.277 21.3L3.939 24 .722 21.3h22.555zM7.6 19.276H3.939V0h6.052a6.653 6.653 0 0 1 6.65 6.646c0 2.234-1.108 4.204-2.799 5.418l5.418 7.211h-4.585l-4.486-5.979H7.6v5.98zm0-9.64h2.392a2.992 2.992 0 0 0 2.989-2.989 2.994 2.994 0 0 0-2.989-2.986H7.6v5.975z"/>
</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 e-commerce collection.
Related JSX icons
FAQ
Is the Rakuten 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.