How to use the Chedraui icon
import { ChedrauiLogo } from "@/assets/icons/chedrauiLogo"
export default function Example() {
return <ChedrauiLogo width="32px" height="32px" />
}E-commerce icon
Chedraui JSX Icon
Copy the Chedraui icon as an optimized JSX SVG component for React, Next.js, dashboards, landing pages and Tailwind interfaces.
ComponentChedrauiLogo
FilechedrauiLogo.jsx
CategoryE-commerce
Copy-ready code
Chedraui React JSX component
// Source: https://raw.githubusercontent.com/simple-icons/simple-icons/a78ea66ee5d93dfd2ab07458de8dff522dcf3d91/icons/chedraui.svg
// Asset license: Simple Icons CC0 1.0 Universal. Brand names and marks remain trademarks of their respective owners.
// Converted from upstream SVG to JSX and parameterized by JSXIcons.
export const ChedrauiLogo = ({ width = "40px", height = "40px", color = "#E0832F", ...props }) => (
<svg {...props} width={width} height={height} viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" fill={color} color={color}>
<path d="M8.5234 4.7246c-.7714 0-1.3984.627-1.3984 1.3984 0 .7731.6253 1.3985 1.3984 1.3985.7715 0 1.3985-.627 1.3985-1.3985 0-.7714-.627-1.3984-1.3985-1.3984zm4.1504 1.5742c-.7324 0-1.3261.5938-1.3261 1.3262.0016.7308.5953 1.3242 1.3261 1.3242.7324 0 1.3242-.5934 1.3242-1.3242 0-.7324-.5934-1.3262-1.3242-1.3262zM7.5313 7.9023a.1707.1707 0 0 0-.172.17v5.4453c0 .0944.0774.1719.172.1719h2.498c.0944 0 .17-.0774.17-.172v-2.3632c0-.153.1855-.2282.2929-.1191l.4043.3476c.109.109.2946.0316.293-.123l-.0196-1.6739a.1741.1741 0 0 0-.0488-.1191L9.576 7.9531a.178.178 0 0 0-.123-.0508Zm4.1914 1.4082a.169.169 0 0 0-.17.17v4.125a.1708.1708 0 0 1-.0507.121l-1.1114 1.1114c-.1074.1074-.0322.293.1192.293l3.7597.0078a.1707.1707 0 0 0 .172-.17v-2.828c0-.153.1855-.2287.2929-.1212l1.1562 1.1563a.1687.1687 0 0 0 .1211.0488l1.1778-.0059c.1513-.0015.2285-.1839.121-.293l-3.543-3.5663a.1804.1804 0 0 0-.123-.0489Zm-8.5918.125c-.6384.0324-1.1465.5607-1.1465 1.207 0 .6675.5417 1.2071 1.209 1.2071.6673 0 1.207-.5397 1.207-1.207 0-.6673-.5397-1.207-1.207-1.207-.021 0-.042-.0012-.0625 0zm15.8086 2.0801c-.5887.03-1.0567.5193-1.0567 1.1153 0 .6152.4964 1.1132 1.1133 1.1132.6152 0 1.1152-.498 1.1152-1.1132 0-.6153-.5-1.1153-1.1152-1.1153zm-16.5957.6758a.1725.1725 0 0 0-.172.1719v3.9902c0 .0944.0775.1719.172.1719h1.873c.0944 0 .17-.0775.17-.1719v-1.5312c0-.153.1855-.2306.2929-.123l.6133.6132a.171.171 0 0 0 .2441-.002l.8125-.8418c.0651-.0668.0667-.1732 0-.2383l-1.9629-1.9882a.168.168 0 0 0-.121-.0508zm14.7968 1.1524a.4455.4455 0 0 0-.4453.4453c0 .2457.1996.4453.4453.4453a.4318.4318 0 0 0 .1133-.0157l.7773.7774a.168.168 0 0 1 .043.0683l.9668 2.9883a.1726.1726 0 0 0 .1621.1192h.3867c-.187.0976-.3164.2912-.3164.5175 0 .3238.262.586.586.586.3239 0 .586-.262.586-.586 0-.2262-.1293-.42-.3165-.5175h2.3594c-.1872.0976-.3164.2912-.3164.5175 0 .3238.262.586.586.586.3237 0 .5859-.262.5859-.586a.5817.5817 0 0 0-.3145-.5175h.371c.0946 0 .17-.0775.17-.1719l.0156-.1172a.2555.2555 0 0 0-.2558-.2851h-3.7578c-.0716 0-.1318-.0424-.1367-.0977-.0341-.1387-.0848-.2752-.127-.4121a.124.124 0 0 1 .1074-.1621h3.9746a.3494.3494 0 0 0 .3457-.3067c.0881-.7473.176-1.4948.2637-2.2422-.0098-.0912-.0846-.162-.1758-.162l-5.6817-.006a.116.116 0 0 1-.084-.0351l-.4784-.4492a.444.444 0 0 0-.4395-.3809Zm-9.6093.8574a.1705.1705 0 0 0-.1211.0508l-4.6407 4.6738c-.1074.109-.03.293.123.293h1.8067a.175.175 0 0 0 .123-.0508l4.672-4.6739c.109-.1074.0338-.293-.1192-.293Zm2.7753 1.3867a.1688.1688 0 0 0-.121.0488l-3.2637 3.289c-.1074.1092-.032.293.121.293h1.8028a.1705.1705 0 0 0 .1211-.0507l3.2422-3.2422a.174.174 0 0 1 .2441 0l3.2422 3.2422a.1688.1688 0 0 0 .1192.0508h1.789c.153 0 .2306-.184.123-.293l-3.2656-3.289a.1731.1731 0 0 0-.123-.049zM2.1113 16.912a.1707.1707 0 0 0-.121.0508l-.0938.0937-1.8457 1.8692c-.1074.109-.032.293.121.293H1.373a.1678.1678 0 0 0 .1211-.0508l1.963-1.963c.1105-.109.0338-.2929-.1192-.2929z"/>
</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 Chedraui 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.