E-commerce icon

OXXO JSX Icon

Q: Is the OXXO JSX icon free?

Yes. You can copy the OXXO JSX component and use it in React and Next.js projects.

Q: Can I customize the OXXO icon?

Yes. Edit SVG attributes or pass className, width, height and color props depending on the component.

Copy the OXXO icon as an optimized JSX SVG component for React, Next.js, dashboards, landing pages and Tailwind interfaces.

Browse all icons

ComponentOxxoLogo

FileoxxoLogo.jsx

CategoryE-commerce

Copy-ready code

OXXO React JSX component

// Source: https://commons.wikimedia.org/wiki/Special:PermanentLink/1033797700
// Asset license: Public domain textlogo
// Optimized, converted to monochrome currentColor JSX, and parameterized by JSXIcons.
export const OxxoLogo = ({ width = "40px", height = "40px", color = "#E30613", ...props }) => (
  <svg {...props} width={width} height={height} viewBox="35.43 35.45 885.83 448.9" xmlns="http://www.w3.org/2000/svg" fill={color} color={color}>
    <path d="M-792.457-878.048c0-29.6 23.773-53.619 53.129-53.619H40.119c29.33 0 53.128 24.018 53.128 53.619v339.165c0 29.6-23.797 53.594-53.128 53.594h-779.447c-29.356 0-53.129-23.993-53.129-53.594z" transform="translate(827.89 968.22)"/><path d="M-791.845-883.46c0-27.224 21.888-49.308 48.869-49.308H44.526c26.98 0 48.844 22.084 48.844 49.309v1.567h-885.215zM93.37-534.402v1.224c0 27.225-21.864 49.31-48.844 49.31h-787.502c-26.98 0-48.869-22.085-48.869-49.31v-1.224z" transform="translate(827.89 968.22)"/><path d="M-179.202-708.845c0 68.92 55.357 124.79 123.665 124.79 68.284 0 123.665-55.87 123.665-124.79 0-68.945-55.381-124.815-123.665-124.815-68.308 0-123.665 55.87-123.665 124.815m-589.604 0c0 68.92 55.38 124.79 123.689 124.79 68.284 0 123.665-55.87 123.665-124.79 0-68.945-55.381-124.815-123.665-124.815-68.308 0-123.69 55.87-123.69 124.815M93.37-558.028h-609.754c10.993-7.786 21.227-18.436 32.39-32.808l62.115-79.987 27.127 34.595 30.188-40.52-26.393-33.909 63.216-81.43c20.076-25.83-18.314-56.19-38.39-30.36l-55.87 71.98-56.802-72.935c-20.1-25.756-58.417 4.676-38.316 30.457l64.195 82.313-69.459 89.437c-24.679 31.78-49.309 60.914-98.202 63.167h-171.26v-300.238h606.547c-10.43 7.688-20.272 17.995-30.947 31.755l-62.09 79.962-27.151-34.57-30.163 40.52 26.393 33.884-63.24 81.431c-20.052 25.83 18.337 56.19 38.39 30.36l55.894-71.957 56.801 72.911c20.101 25.781 58.417-4.652 38.316-30.432l-64.194-82.337 69.458-89.413c22.672-29.233 45.319-56.213 86.793-62.114H93.37zm-222.944-150.817c0-41.279 33.15-74.723 74.037-74.723s74.013 33.444 74.013 74.723c0 41.254-33.126 74.698-74.013 74.698s-74.037-33.444-74.037-74.698m-589.58 0c0-41.279 33.15-74.723 74.037-74.723 40.862 0 74.013 33.444 74.013 74.723 0 41.254-33.15 74.698-74.013 74.698-40.887 0-74.037-33.444-74.037-74.698" transform="translate(827.89 968.22)"/>
  </svg>
)

How to use the OXXO icon

import { OxxoLogo } from "@/assets/icons/oxxoLogo"

export default function Example() {
  return <OxxoLogo width="32px" height="32px" />
}

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.

ReactNext.jsJSXSVGE-commerce icons

Looking for a similar mark? Browse the related icons below or explore the full e-commerce collection.

Related JSX icons

7-Eleven

Albert Heijn

Aldi Nord

Aldi Süd

Alibaba.com

Allegro

Argos

ASDA

FAQ

Is the OXXO 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.