# I've made an image file to Arcade sprite converter. Feedback and code improvements wanted!
**URL:** https://forum.makecode.com/t/ive-made-an-image-file-to-arcade-sprite-converter-feedback-and-code-improvements-wanted/2076
**Category:** Show & Tell
**Created:** [May 13, 2020, 7:20pm UTC](https://forum.makecode.com/t/ive-made-an-image-file-to-arcade-sprite-converter-feedback-and-code-improvements-wanted/2076 "2020-05-13T19:20:51Z")
**Posts on this page:** 20
**Page:** 1
### Author:  [@kristianpedersen](https://forum.makecode.com/u/kristianpedersen)
#### Post date: [May 13, 2020, 7:20pm UTC](https://forum.makecode.com/t/ive-made-an-image-file-to-arcade-sprite-converter-feedback-and-code-improvements-wanted/2076/1 "2020-05-13T19:20:51Z")
Hi! I’ve made a utility that converts images files to MakeCode Arcade sprites.
It can scale images, and you can even import wallpaper images and have them converted. It’s so much fun!
[https://kristianpedersen.github.io/Convert-Image-to-MakeCode-Arcade-Sprite/](https://kristianpedersen.github.io/Convert-Image-to-MakeCode-Arcade-Sprite/)
I need some fresh eyes to look at it. I would be happy to receive pull requests and code critique. I’m eager to learn more proper ways of doing things.
> **[kristianpedersen/Convert-Image-to-MakeCode-Arcade-Sprite](https://github.com/kristianpedersen/Convert-Image-to-MakeCode-Arcade-Sprite)**
>
> Returns a text string that can be pasted in MakeCode Arcade's JavaScript window - kristianpedersen/Convert-Image-to-MakeCode-Arcade-Sprite
Improvements:
- Drag and drop
- Checkbox for making white or black transparent
- Bordered rectangle around preview image, showing how big it is relative to MakeCode Arcade
- Testing in other browsers than Chrome
- Black and white mode, and other cool color effects
- The copy button used to change text when textarea contents were copied, but now it doesn’t
- … ?
I found two similar tools when making this post, both of which have features I’m lacking, but they don’t have my sizing options.
I’m a new user, and new users are only allowed to post two links, so you’ll have to google these:
- makecode-pixelart-maker (Drag and drop)
- pxt-arcade-asset-tool/ (Has option for transparency, but only for white)
---
### Author:  [@MKleinSB](https://forum.makecode.com/u/MKleinSB)
#### Post date: [May 13, 2020, 7:47pm UTC](https://forum.makecode.com/t/ive-made-an-image-file-to-arcade-sprite-converter-feedback-and-code-improvements-wanted/2076/2 "2020-05-13T19:47:23Z")
works for me, but the improvements will be great!
---
### Author:  [@gnitz](https://forum.makecode.com/u/gnitz)
#### Post date: [May 14, 2020, 9:31pm UTC](https://forum.makecode.com/t/ive-made-an-image-file-to-arcade-sprite-converter-feedback-and-code-improvements-wanted/2076/3 "2020-05-14T21:31:29Z")
This is really great - I’ve been looking for something like this. Seems to work great for the images I tested.
---
### Author:  [@omnisImperium](https://forum.makecode.com/u/omnisImperium)
#### Post date: [October 28, 2020, 12:48pm UTC](https://forum.makecode.com/t/ive-made-an-image-file-to-arcade-sprite-converter-feedback-and-code-improvements-wanted/2076/4 "2020-10-28T12:48:49Z")
Thanks a ton. This is epic. I have been looking for something like this for a long time.
Just confirming, I enter the copied code into java script, right?
---
### Author:  [@Kat](https://forum.makecode.com/u/Kat)
#### Post date: [October 28, 2020, 12:51pm UTC](https://forum.makecode.com/t/ive-made-an-image-file-to-arcade-sprite-converter-feedback-and-code-improvements-wanted/2076/5 "2020-10-28T12:51:23Z")
Yep! Just paste it into Javascript 🙂
---
### Author:  [@omnisImperium](https://forum.makecode.com/u/omnisImperium)
#### Post date: [October 28, 2020, 12:52pm UTC](https://forum.makecode.com/t/ive-made-an-image-file-to-arcade-sprite-converter-feedback-and-code-improvements-wanted/2076/6 "2020-10-28T12:52:55Z")
epik. thanks
---
### Author:  [@Dreadmask197](https://forum.makecode.com/u/Dreadmask197)
#### Post date: [October 28, 2020, 1:17pm UTC](https://forum.makecode.com/t/ive-made-an-image-file-to-arcade-sprite-converter-feedback-and-code-improvements-wanted/2076/7 "2020-10-28T13:17:11Z")
I enter it into the editor drawing thing in the editor. It still works in JavaScript as well I guess
---
### Author:  [@omnisImperium](https://forum.makecode.com/u/omnisImperium)
#### Post date: [October 28, 2020, 1:30pm UTC](https://forum.makecode.com/t/ive-made-an-image-file-to-arcade-sprite-converter-feedback-and-code-improvements-wanted/2076/8 "2020-10-28T13:30:56Z")
How do you enter it into the editor thingy?
---
### Author:  [@Dreadmask197](https://forum.makecode.com/u/Dreadmask197)
#### Post date: [October 28, 2020, 2:16pm UTC](https://forum.makecode.com/t/ive-made-an-image-file-to-arcade-sprite-converter-feedback-and-code-improvements-wanted/2076/9 "2020-10-28T14:16:21Z")
Just get into the editor and just do crtl v. with the correct width and height
---
### Author:  [@omnisImperium](https://forum.makecode.com/u/omnisImperium)
#### Post date: [October 28, 2020, 2:17pm UTC](https://forum.makecode.com/t/ive-made-an-image-file-to-arcade-sprite-converter-feedback-and-code-improvements-wanted/2076/10 "2020-10-28T14:17:27Z")
cool. thanks
---
### Author:  [@Dreadmask197](https://forum.makecode.com/u/Dreadmask197)
#### Post date: [October 28, 2020, 2:22pm UTC](https://forum.makecode.com/t/ive-made-an-image-file-to-arcade-sprite-converter-feedback-and-code-improvements-wanted/2076/11 "2020-10-28T14:22:31Z")
sorry for the late response though
---
### Author:  [@omnisImperium](https://forum.makecode.com/u/omnisImperium)
#### Post date: [October 28, 2020, 2:31pm UTC](https://forum.makecode.com/t/ive-made-an-image-file-to-arcade-sprite-converter-feedback-and-code-improvements-wanted/2076/12 "2020-10-28T14:31:52Z")
its fine
---
### Author:  [@frank\_schmidt](https://forum.makecode.com/u/frank_schmidt)
#### Post date: [March 15, 2021, 3:33pm UTC](https://forum.makecode.com/t/ive-made-an-image-file-to-arcade-sprite-converter-feedback-and-code-improvements-wanted/2076/13 "2021-03-15T15:33:09Z")
I had difficulty at first creating a sprite and a background (scene) from a photo because of my weak text coding knowledge. I made the mistake of creating a Start\> set my sprite to…blank . and then tried to import the digitized image from Mr. Pedersen’s utility but got error messages due to faulty text conflicts in JavaScript.
So, I now start with a blank page in JS and copy/paste the utility code array directly onto blank text workspace. Since this creates a sprite I can then add “background scene” and drag the sprite image onto that bubble and now have a custom background. If the sprite size in the utility was 160x120 then it will nearly cover the TFT screen as a background image. Now we can take a cell phone photo of the building front of the coffee shop where we do coding lessons, convert that photo to a sprite first and then drag the sprite image into the scene block for game background and begin story-telling about the place and the lessons which we have learned in coding / electronics today. We can also use Meowbit/edgeconnector to learn electronics I/O on a breadboard. Thanks @kristianpedersen !
---
### Author:  [@kristianpedersen](https://forum.makecode.com/u/kristianpedersen)
#### Post date: [July 20, 2021, 4:16pm UTC](https://forum.makecode.com/t/ive-made-an-image-file-to-arcade-sprite-converter-feedback-and-code-improvements-wanted/2076/14 "2021-07-20T16:16:44Z")
Hi, Frank! Thanks for the feedback!
Creating a sprite first sounds intuitive, but as you discovered, that’s not how the code works.
Also, it’s really fun to have large images, and animate which part is showing.
Then you could have a large picture of your building that goes off screen, and animate the X and Y coordinates of the sprite, like this: [https://makecode.com/\_XiRh6PeWvUDH](https://makecode.com/_XiRh6PeWvUDH)
Changelog 20 july 2021:
- Added text to website, explaining manual sprite creation is not needed
- Each new image now gets a unique variable name, just to prevent naming conflicts. Used to just be “mySprite”, is now "mySprite[unique string from today’s date]
---
### Author:  [@Eretick](https://forum.makecode.com/u/Eretick)
#### Post date: [July 26, 2021, 4:57pm UTC](https://forum.makecode.com/t/ive-made-an-image-file-to-arcade-sprite-converter-feedback-and-code-improvements-wanted/2076/15 "2021-07-26T16:57:13Z")
Hi there! Thats awesome, but it should support transparent color instead of making black.
Also would be perfect to have de-converter → from arcade code to img file.
---
### Author:  [@nayrbgo](https://forum.makecode.com/u/nayrbgo)
#### Post date: [March 2, 2022, 4:06pm UTC](https://forum.makecode.com/t/ive-made-an-image-file-to-arcade-sprite-converter-feedback-and-code-improvements-wanted/2076/16 "2022-03-02T16:06:34Z")
wow – this made my day! my year!
---
### Author:  [@randomuser](https://forum.makecode.com/u/randomuser)
#### Post date: [November 10, 2022, 11:03pm UTC](https://forum.makecode.com/t/ive-made-an-image-file-to-arcade-sprite-converter-feedback-and-code-improvements-wanted/2076/17 "2022-11-10T23:03:21Z")
I love this! One suggestion, have an option for using any 16 colors - the new color extension lets users use their own set of 16 colors so choosing 16 based on the image could make it look even better!!
---
### Author:  [@Kokoadi](https://forum.makecode.com/u/Kokoadi)
#### Post date: [February 23, 2023, 4:58pm UTC](https://forum.makecode.com/t/ive-made-an-image-file-to-arcade-sprite-converter-feedback-and-code-improvements-wanted/2076/18 "2023-02-23T16:58:19Z")
I hope it update to better smooth color or close real color like image. I agree with @randomuser
---
### Author:  [@Workbench](https://forum.makecode.com/u/Workbench)
#### Post date: [October 9, 2023, 4:50pm UTC](https://forum.makecode.com/t/ive-made-an-image-file-to-arcade-sprite-converter-feedback-and-code-improvements-wanted/2076/19 "2023-10-09T16:50:11Z")
I tried importing some Pizza Tower sprites, but it didn’t look very good. Rip me, ig. 💀. Either way, this is really impressive, or at least to a monkey brain like me. Keep up the good work.
---
### Author:  [@Sarge](https://forum.makecode.com/u/Sarge)
#### Post date: [October 10, 2023, 6:32pm UTC](https://forum.makecode.com/t/ive-made-an-image-file-to-arcade-sprite-converter-feedback-and-code-improvements-wanted/2076/20 "2023-10-10T18:32:24Z")
That profile picture gives me nightmares
[Next page](https://forum.makecode.com/t/ive-made-an-image-file-to-arcade-sprite-converter-feedback-and-code-improvements-wanted/2076.md?page=2)