How to use the Comme des Garçons icon
import { CommeDesGarconsLogo } from "@/assets/icons/commedesgarconsLogo"
export default function Example() {
return <CommeDesGarconsLogo width="32px" height="32px" />
}Brands icon
Copy the Comme des Garçons icon as an optimized JSX SVG component for React, Next.js, dashboards, landing pages and Tailwind interfaces.
Copy-ready code
// Source: https://commons.wikimedia.org/wiki/Special:PermanentLink/1086088971
// Asset license: Public domain textlogo
// Optimized, converted to monochrome currentColor JSX, and parameterized by JSXIcons.
export const CommeDesGarconsLogo = ({ width = "40px", height = "40px", color = "#000000", ...props }) => (
<svg {...props} width={width} height={height} viewBox="0 0 953.067 120" xmlns="http://www.w3.org/2000/svg" fill={color} color={color}>
<path d="M332.004 582c-6.004 46-50 82-102.004 82-92.004 0-126-78-126-160 0-78 33.996-156 126-156 62.004 0 97.996 44 106 104h100c-10-116-90-190-206-190C86 262 0 370 0 504.012 0 642 84 750 230 750c102.004 0 187.996-60 202.004-168zM686 348c90 0 124 78 124 156 0 82-34 160-124 160s-123.996-78-123.996-160C560 426 594 348 686 348m0 402c141.996 0 224-108 224-246 0-134-84-242-224-242-142 0-223.996 108-223.996 242C460 642 544 750 686 750M944 724h136l104-310h2l98 310h136V274h-90v320h-2l-108-320h-74l-108 316h-2V274h-90v450zM1458 724h136l104-310h2l98 310h136V274h-90v320h-2l-108-320h-74l-108 316h-2V274h-90v450zM2004 724h336v-84h-238v-96h218v-76h-218V358h242v-84h-342v450zM4244 320c-36-46-82-64-126-64-142 0-224 108-224 242 0 138 84 246 224 246 94 0 182-58 192-164h-96c-12 52-50 78-96 78-90 0-124-78-124-160 0-78 34-156 124-156 66 0 104 36 108 100h-102v76h192V266h-64zM4510 448h114l-56 172h-2zm10 286h100l166-466h-102l-34 104h-166l-34-104h-98zM4916 524h108c44 0 68 20 68 66s-24 64-68 64h-108zm-98 210h242c80 0 132-58 132-128 0-54-22-96-70-116v-2c48-14 62-62 66-110 2-30 2-84 18-110h-98c-12 30-10 74-16 112-6 50-26 70-74 70h-98V268h-98v466zM5550 578c-6 46-50 82-100 82-90 0-124-78-124-160 0-78 34-156 124-156 62 0 96 44 104 104h98c-10-116-88-190-200-190-142 0-224 108-224 242 0 138 84 246 224 246 100 0 184-60 198-168zM5916 342c90 0 122 78 122 156 0 82-34 160-122 160-90 0-122-78-122-160 0-76 32-156 122-156m0 404c140 0 222-108 222-246 0-134-82-242-222-242s-222 108-222 242c0 138 82 246 222 246M6190 734h98l188-312h2v312h94V268h-100l-188 312h-2V268h-94v466zM6712 422c0-62 48-86 102-86 36 0 88 10 88 58 0 50-68 58-136 78-68 18-136 46-136 132 0 96 88 142 170 142 96 0 184-42 184-150h-98c-4 56-42 70-90 70-32 0-70-14-70-52 0-36 22-40 136-70 34-8 136-30 136-136 0-86-66-150-190-150-102 0-196 50-194 166h98zM5472 136l74 28 18-48-74-24 46-62-42-30-46 64-44-64-42 30 46 62-74 24 18 48 72-28v78h50v-78zM2774 550c-58 0-78-50-78-104 0-50 24-104 78-104 60 0 76 52 76 106 0 52-18 102-76 102m78-226c-22-36-58-50-100-50-98 0-146 84-146 174 0 88 48 170 144 170 38 0 76-16 98-48h2v164h90V284h-86v40zM3208 480c-8 46-28 70-72 70-56 0-74-44-74-70zm-146-56c2-56 30-82 80-82 36 0 64 22 70 42h78c-26-76-78-110-152-110-102 0-166 70-166 172 0 98 68 172 166 172 110 0 164-94 158-194zM3416 388c0-40 34-54 68-54 26 0 58 10 58 42 0 28-38 36-102 50-52 12-104 30-104 86 0 84 72 104 142 104 72 0 136-24 144-104h-82c-2 34-28 44-62 44-20 0-50-4-50-30 0-32 50-36 102-48s104-30 104-92c0-86-74-114-148-114-76 0-150 28-154 114h84z" transform="matrix(.13333 0 0 -.13333 10 110)"/>
</svg>
)
import { CommeDesGarconsLogo } from "@/assets/icons/commedesgarconsLogo"
export default function Example() {
return <CommeDesGarconsLogo width="32px" height="32px" />
}Built for the web
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.
Yes. You can copy the JSX component and use it in React and Next.js projects.
Yes. Edit the SVG attributes or pass className, width, height and color props depending on the component.