new icon: remix (original, original-wordmark, line, line-wordmark)

[AnshSinghSonkhia]

Double check these details before you open a PR

• PR does not match another non-stale PR currently opened
• PR name matches the format new icon: Icon name (versions separated by comma). More details here
• PR's base is the develop branch.
• Your icons are inside a folder as seen here
• SVG matches the standards laid out here
• A new object is added in the devicon.json file as seen here

This PR closes #2127

Link to prove your SVG is correct and up-to-date.

• https://remix.run/
• https://drive.google.com/drive/u/0/folders/1pbHnJqg8Y1ATs0Oi8gARH7wccJGv4I2c

credits

Thanks to @weh

[weh]

hi @AnshSinghSonkhia, thx for your contribution.
You need to check your SVG files according to https://github.com/devicons/devicon/blob/develop/CONTRIBUTING.md#svgStandards

• The plain and line versions (with or without wordmark) need to stay as simple as possible. They must have only one color and the paths are united. The color will be removed when being turned into icons so the .svg can have any color.
• The SVG should be on a single line, with a following empty line
• Check the Line version, to be a path, not strokes

[AnshSinghSonkhia]

I made some changes @weh.
Kindly, guide me on any additional changes that you may need.

[canaleal]

Nice, almost there. 👍
Now we gotta make sure to update the SVGs as they don't meet the standards layed out in the wiki.

Here's a tutorial on how to update the SVGs, and optimize them.

[AnshSinghSonkhia]

Nice, almost there. 👍 Now we gotta make sure to update the SVGs as they don't meet the standards layed out in the wiki.

Here's a tutorial on how to update the SVGs, and optimize them.

Thanks for sharing the tutorial @canaleal !!
I have updated the SVGs according to the standards!

[canaleal]

Excellent work 👍 Almost there.

Don't forget to that all the SVGs need to have 1 path only and must be optimized.

You can follow the tutorial I provided before on how to unify the paths and optimize the SVGs. The section is called Unify the Paths and create Plain Icons (Inkscape). You don't need to create plain icons, but make sure that the original svgs and the line svgs only have 1 path, 1 fill color, and the paths are not grouped.

Dont forget to optimize all the SVGs too using SVGOMG. You can also find this step in the tutorial.

[AnshSinghSonkhia]

Excellent work 👍 Almost there.

Don't forget to that all the SVGs need to have 1 path only and must be optimized.

You can follow the tutorial I provided before on how to unify the paths and optimize the SVGs. The section is called Unify the Paths and create Plain Icons (Inkscape). You don't need to create plain icons, but make sure that the original svgs and the line svgs only have 1 path, 1 fill color, and the paths are not grouped.

Dont forget to optimize all the SVGs too using SVGOMG. You can also find this step in the tutorial.

I successfully Unified the Paths according to the tutorial
But, Optimizing the SVG using SVGOMG is ruining the viewbox.

Is it necessary to optimizing the SVG for removing inkscape's attributes?

[canaleal]

Hey @AnshSinghSonkhia, yes. the SVGs have to be optimized.

Also, taking a look at the SVGs, there is more than 1 path for all SVGs,.

Original: 2 Paths and its still grouped.

Original-wordmark:

It's the same for the line SVGs.

If possible, could you post the SVG code after the optimizing it in SVGOMG.

[AnshSinghSonkhia]

Optimizing the SVG using SVGOMG

Optimizing is a 1 Click task with SVGVIEWER

I found it more easier to do with it.

1. Visit https://www.svgviewer.dev
2. Upload SVG or paste code

4. Click on Prettify Button.
5. Click on Optimize Button.

BOOM !!! The SVG is optimized, without ruining the viewbox.

[canaleal]

SVG Viewer is an awesome alternative, a previous contributor even recommended it, but notice how the SVGs still have the height, width and even stroke attributes after optimizing them in svg viewer.

<svg width="128" height="128" viewBox="0 0 128 128" fill="none" xmlns="http://www.w3.org/2000/svg"><path style="stroke-width:.270613;fill:#121212;fill-opacity:1" d="M8.389 0v26.09h55.445c14.656 0 21.986 6.29 21.986 16.67 0 11.804-7.33 16.263-21.986 16.263H8.389v26.663h53.818c11.603 0 17.912 3.255 18.93 17.91.77 10.01.674 14.965.582 19.718-.03 1.53-.06 3.038-.06 4.686h34.218c0-7.567 0-14.5-1.15-29.29-1.425-14.857-9.161-22.386-22.393-25.032 15.674-2.036 27.277-14.248 27.277-32.973C119.611 15.671 103.122 0 69.941 0zm0 108.125V128h43.535v-12.72c0-2.674-1.312-7.155-7.356-7.155z"/></svg>

And this is how it looks when I copied the original svg code from above into SVGOMG. The viewbox is still 0 0 128 128.

<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 128 128"><path fill="#121212" d="M8.389 0v26.09h55.445c14.656 0 21.986 6.29 21.986 16.67 0 11.804-7.33 16.263-21.986 16.263H8.389v26.663h53.818c11.603 0 17.912 3.255 18.93 17.91.77 10.01.674 14.965.582 19.718-.03 1.53-.06 3.038-.06 4.686h34.218c0-7.567 0-14.5-1.15-29.29-1.425-14.857-9.161-22.386-22.393-25.032 15.674-2.036 27.277-14.248 27.277-32.973C119.611 15.671 103.122 0 69.941 0zm0 108.125V128h43.535v-12.72c0-2.674-1.312-7.155-7.356-7.155z"/></svg>

[AnshSinghSonkhia]

SVG Viewer is an awesome alternative, a previous contributor even recommended it, but notice how the SVGs still have the height, width and even stroke attributes after optimizing them in svg viewer.

<svg width="128" height="128" viewBox="0 0 128 128" fill="none" xmlns="http://www.w3.org/2000/svg"><path style="stroke-width:.270613;fill:#121212;fill-opacity:1" d="M8.389 0v26.09h55.445c14.656 0 21.986 6.29 21.986 16.67 0 11.804-7.33 16.263-21.986 16.263H8.389v26.663h53.818c11.603 0 17.912 3.255 18.93 17.91.77 10.01.674 14.965.582 19.718-.03 1.53-.06 3.038-.06 4.686h34.218c0-7.567 0-14.5-1.15-29.29-1.425-14.857-9.161-22.386-22.393-25.032 15.674-2.036 27.277-14.248 27.277-32.973C119.611 15.671 103.122 0 69.941 0zm0 108.125V128h43.535v-12.72c0-2.674-1.312-7.155-7.356-7.155z"/></svg>

And this is how it looks when I copied the original svg code from above into SVGOMG. The viewbox is still 0 0 128 128.

<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 128 128"><path fill="#121212" d="M8.389 0v26.09h55.445c14.656 0 21.986 6.29 21.986 16.67 0 11.804-7.33 16.263-21.986 16.263H8.389v26.663h53.818c11.603 0 17.912 3.255 18.93 17.91.77 10.01.674 14.965.582 19.718-.03 1.53-.06 3.038-.06 4.686h34.218c0-7.567 0-14.5-1.15-29.29-1.425-14.857-9.161-22.386-22.393-25.032 15.674-2.036 27.277-14.248 27.277-32.973C119.611 15.671 103.122 0 69.941 0zm0 108.125V128h43.535v-12.72c0-2.674-1.312-7.155-7.356-7.155z"/></svg>

Okay @canaleal, so what do you want me to do now, for the best results?

[AnshSinghSonkhia]

With SVGOMG

<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 128 128"><path fill="#121212" d="M8.389 0v26.09h55.445c14.656 0 21.986 6.29 21.986 16.67 0 11.804-7.33 16.263-21.986 16.263H8.389v26.663h53.818c11.603 0 17.912 3.255 18.93 17.91.77 10.01.674 14.965.582 19.718-.03 1.53-.06 3.038-.06 4.686h34.218c0-7.567 0-14.5-1.15-29.29-1.425-14.857-9.161-22.386-22.393-25.032 15.674-2.036 27.277-14.248 27.277-32.973C119.611 15.671 103.122 0 69.941 0zm0 108.125V128h43.535v-12.72c0-2.674-1.312-7.155-7.356-7.155z"/></svg>

I have not committed these changes, @canaleal

It is showing 150px height & width, Will it work?

[canaleal]

Yes, I just check the SVG code you provided in the comment above and it looks good on inkscape and icomoon.

[AnshSinghSonkhia]

Hey @canaleal & @weh,
The required changes are DONE. It's good to go, hopefully!!

I Got to learn a lot with this PR. Let me know if we need any more changes.

[canaleal]

Excellent work! 🚀
SVGs are good and properly optimized.

The font icons look good on icomoon, and there are no artifacts.

[github-actions]

Hi!

I'm the check-bot and we have some issues with your PR:

devicon.json is not sorted correctly.
Please make sure that your icon is added in the `devicon.json` file at the correct alphabetic position
as seen here: https://github.com/devicons/devicon/wiki/Updating-%60devicon.json%60

Check our CONTRIBUTING guide for more details regarding these errors.

Please address these issues. When you update this PR, I will check your SVGs again.

Thanks for your help,
SVG-Checker Bot 😄

[AnshSinghSonkhia]

Still, this pr has one pending review @canaleal

[canaleal]

Yup, thats pretty much the process. At least 2 reviewers are need to ensure that the changes are correct.

[weh]

LGTM 👍

[github-actions]

Hi!

I'm the check-bot and we have some issues with your PR:

devicon.json is not sorted correctly.
Please make sure that your icon is added in the `devicon.json` file at the correct alphabetic position
as seen here: https://github.com/devicons/devicon/wiki/Updating-%60devicon.json%60

Check our CONTRIBUTING guide for more details regarding these errors.

Please address these issues. When you update this PR, I will check your SVGs again.

Thanks for your help,
SVG-Checker Bot 😄