I am trying to make an simple-png image file from scratch, using hex editor.
[![enter image description here](https://i.stack.imgur.com/YV5z0.png)](https://i.stack.imgur.com/YV5z0.png)

Bytes before the highlighted region are for PNG file header and IHDR. Which states that I am trying to make an

1. 10 x 10 Png file
2. Greyscale color space
3. 1 bit depth (bi-level)
4. Deflate Compression?
5. Adaptive Filtering?
6. No interlace

The bytes highlighted are a placeholder for the future length of the IDAT field.

**Question:-** Now I am unsure on what (*or How?*) am I supposed to put the image data in the IDAT field?

I am aware of Pixel values of an image being an matrix of **MxN** dimensions. Being displayed somewhat like:

```
[ (255, 255, 255), (255, 255, 255) ... (255, 255, 255)] 
[ (255, 255, 255), (255, 255, 255) ... (255, 255, 255)] 
[ (255, 255, 255), (255, 255, 255) ... (255, 255, 255)]
[ (255, 255, 255), (255, 255, 255) ... (255, 255, 255)] 

```

The Pixel values of an White RGB image, where top left tuple is the color value of pixel at `(0, 0)` and bottom right being the one for `(m-1, n-1)`.

Now how am I supposed to code that into the IDAT header's data structure?
What I am trying to know is how values like above (*pixel values*) are transformed into the deflate block?

**P.S.:-** I am not so literate on the workings of Deflate or the filtering algorithms used wherein the png file. I have read the RFC 2083 and Wikipedia page of the Png file. I have also read all relevant answers on stack exchange.