# Is it possible to resize images?

**URL:** <https://discourse.joplinapp.org/t/is-it-possible-to-resize-images/25711>\
**Category:** Lounge\
**Created:** [20 May 2022 20:01 UTC](https://discourse.joplinapp.org/t/is-it-possible-to-resize-images/25711 "2022-05-20T20:01:58Z")\
**Posts on this page:** 7\
**Page:** 1

<div class="post-metadata">

**Author:** ![lonelyadmin](https://yyz2.discourse-cdn.com/flex028/user_avatar/discourse.joplinapp.org/lonelyadmin/32/8680_2.png) [@lonelyadmin](https://discourse.joplinapp.org/u/lonelyadmin)\
**Post date:** [20 May 2022 20:01 UTC](https://discourse.joplinapp.org/t/is-it-possible-to-resize-images/25711/1 "2022-05-20T20:01:58Z")

</div>

Is it possible to resize the images I drag and drop into the editor?

---

<div class="post-metadata">

**Author:** ![Daeraxa](https://yyz2.discourse-cdn.com/flex028/user_avatar/discourse.joplinapp.org/daeraxa/32/6172_2.png) [@Daeraxa](https://discourse.joplinapp.org/u/Daeraxa)\
**Post date:** [20 May 2022 20:07 UTC](https://discourse.joplinapp.org/t/is-it-possible-to-resize-images/25711/2 "2022-05-20T20:07:12Z")

</div>

Not natively but there are a few things you can do.  
Personally if I need a resized image I just use HTML instead of markdown i.e. rather than

```auto
![image](:/5d2e97f37b2649b583d1cc03e987c6e7)

```

I use:

```auto
<img src=":/5d2e97f37b2649b583d1cc03e987c6e7" width="400">

```

There is also a plugin (or plugins) that can do this such as the [Attache](https://github.com/manuerwin/joplin-plugin-attache#readme) plugin where it takes the source image and resizes it for you.

---

<div class="post-metadata">

**Author:** ![johano](https://yyz2.discourse-cdn.com/flex028/user_avatar/discourse.joplinapp.org/johano/32/1053_2.png) [@johano](https://discourse.joplinapp.org/u/johano)\
**Post date:** [20 May 2022 20:16 UTC](https://discourse.joplinapp.org/t/is-it-possible-to-resize-images/25711/3 "2022-05-20T20:16:56Z")

</div>

You can also change the size that images display using the plugin [Joplin Enhancement](https://discourse.joplinapp.org/t/plugin-many-enhancement-for-my-daily-usage/25622)

* * *

First, insert your image, and go to the markdown editor which will show, for example:

`![My inserted image](:/123456abced78910321)`

Now by adding, again for example,` {width=50%}`, so it looks like this:

`![My inserted image](:/123456abced78910321){width=50%}`

the image will appear at half the original size (the image remains the same size it's just displayed according to what you've added in the curly braces)

---

<div class="post-metadata">

**Author:** ![hamblingreg52](https://yyz2.discourse-cdn.com/flex028/user_avatar/discourse.joplinapp.org/hamblingreg52/32/8266_2.png) [@hamblingreg52](https://discourse.joplinapp.org/u/hamblingreg52)\
**Post date:** [21 May 2022 06:38 UTC](https://discourse.joplinapp.org/t/is-it-possible-to-resize-images/25711/4 "2022-05-21T06:38:50Z")

</div>

Using a plugin for resizing images is definitely an amazing and effective solution.

---

<div class="post-metadata">

**Author:** ![sandshrew118](https://yyz2.discourse-cdn.com/flex028/user_avatar/discourse.joplinapp.org/sandshrew118/32/14047_2.png) [@sandshrew118](https://discourse.joplinapp.org/u/sandshrew118)\
**Post date:** [30 May 2023 19:39 UTC](https://discourse.joplinapp.org/t/is-it-possible-to-resize-images/25711/5 "2023-05-30T19:39:18Z")

</div>

Buidling upon the above answer, I use (though I can't remember where I found it and who to credit!):

```auto
<figure>
<img src=":/272198a227744a058467bd1c66140daf" width="500" height="100">
<figcaption> Fig. 1: My figure caption. </figcaption>
</figure>

```

I can never remember the syntax though so I save it in another note.

The only thing I'd like is to make the caption text italicised, but it doesn't accept the markdown syntax for that

---

<div class="post-metadata">

**Author:** ![dpoulton](https://yyz2.discourse-cdn.com/flex028/user_avatar/discourse.joplinapp.org/dpoulton/32/29723_2.png) [@dpoulton](https://discourse.joplinapp.org/u/dpoulton)\
**Post date:** [30 May 2023 19:58 UTC](https://discourse.joplinapp.org/t/is-it-possible-to-resize-images/25711/6 "2023-05-30T19:58:39Z")

</div>

> [@sandshrew118](#):
>
> The only thing I'd like is to make the caption text italicised, but it doesn't accept the markdown syntax for that

If you add the below to **userstyle.css** and quit and restart Joplin all your `<figcaption>`s will be italic.

```css
figcaption {
    font-style: italic;
}

```

More info on the **\<figure\>** tag can be found [here](https://www.w3schools.com/tags/tag_figure.asp).

---

<div class="post-metadata">

**Author:** ![sandshrew118](https://yyz2.discourse-cdn.com/flex028/user_avatar/discourse.joplinapp.org/sandshrew118/32/14047_2.png) [@sandshrew118](https://discourse.joplinapp.org/u/sandshrew118)\
**Post date:** [31 May 2023 19:26 UTC](https://discourse.joplinapp.org/t/is-it-possible-to-resize-images/25711/7 "2023-05-31T19:26:34Z")

</div>

Thank you, that's great! 🤌 I'd never used the **userstyle.css** before, but now see lots of people tinker with it, now I have started too!
