diff --git a/website/docs/guides/images.md b/website/docs/guides/images.md
index 31e67b13b..3e99eaf50 100644
--- a/website/docs/guides/images.md
+++ b/website/docs/guides/images.md
@@ -3,4 +3,110 @@ sidebar_label: Images
title: Images
---
-WIP
+Images are very important for making your app more interesting.
+
+In NodeGui, QLabel is typically used for displaying text, but it can also display an image.
+
+A very minimal example would look like this:
+
+```js
+const { QMainWindow, QPixmap, QLabel } = require('@nodegui/nodegui');
+
+const win = new QMainWindow();
+const label = new QLabel();
+
+const absoulteImagePath = '/Users/atulr/Project/nodegui/nodegui/extras/assets/logox200.png';
+const image = new QPixmap();
+image.load(absoulteImagePath);
+
+label.setPixmap(image);
+
+win.setCentralWidget(label);
+win.show();
+global.win = win;
+```
+
+Here,
+
+- We first create a label using QLabel.
+- Then we create an instance of QPixmap. `QPixmap` is used to represent the image in memory. QPixmap is not a widget, so it can’t be shown on the screen as it is.
+- Hence, we use QLabel instance and set QPixmap to it.
+
+The result would look like this:
+
+
+
+## Loading an image using a url
+
+Lets say we want to load an image from a URL on the internet. In this case we can't use the `load()` method of QPixmap since its only reserved for local file system images.
+
+Instead, we’ll download the image using axios as a buffer and use the QPixmap's method loadFromData instead.
+
+So let’s start with the axios installation:
+
+```sh
+npm i axios
+```
+
+Now let’s create a function that will take a URL as a parameter and will return a configured QMovie instance for the GIF:
+
+```js
+const axios = require('axios');
+
+async function getPixmap(url) {
+ const { data } = await axios.get(url, { responseType: 'arraybuffer' });
+ const pixmap = new QPixmap();
+ pixmap.loadFromData(data);
+ return pixmap;
+}
+```
+
+The `getPixmap` function takes in a URL, tells axios to download the image as a buffer, and then uses that buffer to create a QPixmap instance.
+
+Since getPixmap returns a promise, we need to make some changes to the code. After some minor refactoring, we end up with the following.
+
+```js
+const { QMainWindow, QPixmap, QLabel } = require('@nodegui/nodegui');
+const axios = require('axios');
+async function getPixmap(url) {
+ const { data } = await axios.get(url, { responseType: 'arraybuffer' });
+ const pixmap = new QPixmap();
+ pixmap.loadFromData(data);
+ return pixmap;
+}
+async function main() {
+ const win = new QMainWindow();
+ const label = new QLabel();
+ const image = await getPixmap('https://upload.wikimedia.org/wikipedia/commons/9/96/Nature-morocco.jpg');
+ label.setPixmap(image);
+ win.setCentralWidget(label);
+ win.show();
+ global.win = win;
+}
+main().catch(console.error);
+```
+
+And the result would look like this:
+
+
+
+## Some tips
+
+### Showing large images
+
+The above examples wont allow you to show a huge image without either cutting it off or making the widget huge.
+
+In order to do that:
+
+- You can create the image instance using QPixmap
+- Set the image instance to a QLabel
+- And finally set the QLabel to a QScrollArea that allows you to scroll the image if the size of the image is too big.
+
+### Animated images
+
+In order to use animated images
+
+- Instead of QPixmap use QMovie
+- And instead of a label's `setPixmap` method use `setMovie`
+
+More details on it can be seen on this blog post : [https://www.sitepoint.com/build-native-desktop-gif-searcher-app-using-nodegui/](https://www.sitepoint.com/build-native-desktop-gif-searcher-app-using-nodegui/)