Support

SocialMagick

#42854 Feature request: Drop shadows for overlaid text

Posted in ‘SocialMagick’
This is a public ticket

Everybody will be able to see its contents. Do not include usernames, passwords or any other sensitive information.

Environment Information

Joomla! version
n/a
PHP version
n/a
SocialMagick version
n/a

Latest post by nicholas on Friday, 03 April 2026 09:46 CDT

AndrewSmith

Graphic designer and photoshoppy person here.  I love what you can do with the extensions and particularly what you can do with the mask overlays via the "base image" in the composition stack. 

From my perspective, the ability to add a keyline / outline to the overlaid text is visually a bit rough or stark.  Handy for separating the text from the background so it can be read as easily as possible, it lacks the finesse of what I would like to be able to achieve in terms of a finished professional image.  Granted, it's better than nothing and I am very glad it is in there as an option.

What I would request is that the extension adds support for drop shadows ("-shadow") from the generated text, in addition to the existing ability to set an outline for that text.  Also, that the drop shadow can be set to apply in "multiply" ("-compose Multiply") blending mode for a more natural looking finished image.  With this, please give us the ability to set colour, opacity of the generated shadow, direction and offset etc, just like in Photoshop.  A preset may also come in handy.

This will help us cover our bases given that these images are autogenerated and we can't tweak them manually.

Thanks.

 

nicholas
Akeeba Staff
Manager

ImageMagick can do it. It is slow, it is complicated, but it is possible. 

GD, however, cannot do it. It can only do offset text with a semi-transparent colour. There's no blur, and it looks cheap – and by that I mean 1970s 'zine cheap.

The problem here is that I can't only support ImageMagick, nor can I give you a feature which won't work with both libraries.

Nicholas K. Dionysopoulos

Lead Developer and Director

🇬🇷Greek: native 🇬🇧English: excellent 🇫🇷French: basic • 🕐 My time zone is Europe / Athens
Please keep in mind my timezone and cultural differences when reading my replies. Thank you!

AndrewSmith

That's a shame.  It was a price I was more than willing to pay.  [cheeky smiley]

If it helps, the ability to apply a tint/opacity to the outline of the text could work as a compromise.

Andrew

nicholas
Akeeba Staff
Manager

Hm... let me see what I can do with drop shadow. Maybe I can fake it in GD. The reason I am not sure is that it only offers a single Gaussian blur filter with a fixed radius and sigma value. Maybe if I apply it stacked I can fake something that can pass as a drop shadow if one is not looking too closely. Which is fine, as GD renders text very awkwardly anyway; it's always gonna be the ugly one.

Nicholas K. Dionysopoulos

Lead Developer and Director

🇬🇷Greek: native 🇬🇧English: excellent 🇫🇷French: basic • 🕐 My time zone is Europe / Athens
Please keep in mind my timezone and cultural differences when reading my replies. Thank you!

AndrewSmith

GD is for retro.

Imagick is for professionals.

Pro sites get their provider to install the Imagick extension so they can have the professional look that the amateur sites aspire to.  :-) 

Available to give feedback if it helps you.

Andrew

nicholas
Akeeba Staff
Manager

The ImageMagick result appears to be even less satisfactory. The shadow edges are not feathered, they are harsh. If I cannot find a way to solve it today I might have to give this feature a pass.

Nicholas K. Dionysopoulos

Lead Developer and Director

🇬🇷Greek: native 🇬🇧English: excellent 🇫🇷French: basic • 🕐 My time zone is Europe / Athens
Please keep in mind my timezone and cultural differences when reading my replies. Thank you!

nicholas
Akeeba Staff
Manager

I have added drop shadows. Give this dev release a try: https://www.akeeba.com/download/socialmagick-dev/3-0-2-dev202603271437-rev954a393.html 

Nicholas K. Dionysopoulos

Lead Developer and Director

🇬🇷Greek: native 🇬🇧English: excellent 🇫🇷French: basic • 🕐 My time zone is Europe / Athens
Please keep in mind my timezone and cultural differences when reading my replies. Thank you!

nicholas
Akeeba Staff
Manager

Ugh, it works better if I give you the right link: https://www.akeeba.com/download/socialmagick-dev/3-0-2-dev202604021435-rev61fb29a.html 

Nicholas K. Dionysopoulos

Lead Developer and Director

🇬🇷Greek: native 🇬🇧English: excellent 🇫🇷French: basic • 🕐 My time zone is Europe / Athens
Please keep in mind my timezone and cultural differences when reading my replies. Thank you!

AndrewSmith

Downloading and will give it a test run.

Andrew

AndrewSmith

I've generated an image with some drop shadow in it for the text, per the attached images which also include my related settings.  

What you may note from my settings is that I had adjusted the colour of the 1px text outline back to approximately 60% of black.  This way we still get the edge definition and the contrast of the text versus the background, but without it being super obvious that the outline is there.  The aim is that people don't notice and if anything at all they will think "this is so easy to read". 

Good contrast between the text and the background makes it easier on the brain and therefore a greater rate of cognition for the information transfer.

Something I have noticed with the image outputted is that the file properties reveal it to be 32-bit (which is full RGB colour plus an alpha channel for transparency).  The compression used in the file format may negate the impact of the extra data channel which will be mostly empty and compress well with RLE, but if you can have the image processing library flatten the final output then you may find that the finished file is smaller.

Time to generate the image on my VPS server, which is hardly burdened, is 5.5 seconds by stopwatch though I thought it was only 4 seconds when counting in my head.  Workable if this is the same for others, else would it be a good idea to have a "regenerate all images" button for when users have added or changed settings and a drop shadow is involved?  Might be handy to have the option of the server generating the set of OG images ahead of guest demand.

Andrew

nicholas
Akeeba Staff
Manager

The outline colour, width, or even its existence is highly situational and use-case-specific. I just left the default value in Joomla's colour picker which happens to be black. The point is that you get to use whatever you want. FWIW the option to choose an outline colour was there since version 3.0, you just had not noticed it. I just didn't say anything because it is entirely inconsequential whether you noticed something existed before or not.

Regarding the intended contrast between text and image, again, it is highly situational and depends on your art direction. If you are doing International Style minimalism or 2010s Brutalist web design you are going for lower contrast, giving it a more subdued and quiet look. That would work for luxury brands, spas, and hipster-catering sites. Also remember that the contrast you get depends on both the image and the text. Black would be 100% contrast against a pale image (e.g. applying a fair amount of desaturation, increasing brightness, lowering contrast) but 0% contrast against a mostly black / dark image (e.g. an image from a space telescope). I understand contrast; my software is accessible. You ask me if I can magically change the outline to make it have high contrast? No, unless you want to be spending a hell of a lot of money and stupid amounts of time to run AI inference at least thrice, once to do computer vision, once to come up with a good contrasting colour, and once again to do computer vision on the composite to ensure acceptable results – with the loop repeating up to X times until the result is satisfactory. Or, you know, you can use contrasting colors for the text and its outline to come up with legible text regardless of the background image.

The way the image is encoded is limited by what is supported by and works with PHP. Dropping the alpha channel causes catastrophic rendering artefacts.

Besides, no file format conceived the last 30 years uses just RLE; the "newest" format doing that was BMP introduced in 1987. Lossless WebP decorrelates colour channels and uses LZ77 + Huffman coding; RLE is just a small part of the overall LZ77 implementation which is in itself a very small part of the compression pipeline. If you choose lossy compression for WebP the alpha channel is dropped completely and the image is expressed in YCbCr colour similar to JPEG with 8 bits per channel. However, the size difference does not come from the drop of the alpha channel, but the nature of lossy compression (at the expense of compression artefacts, of course).

You can force the regeneration of all images by clearing the image cache. There's a button for that in the component. If there's no cached image, it gets regenerated. Simple enough, eh? :)

Nicholas K. Dionysopoulos

Lead Developer and Director

🇬🇷Greek: native 🇬🇧English: excellent 🇫🇷French: basic • 🕐 My time zone is Europe / Athens
Please keep in mind my timezone and cultural differences when reading my replies. Thank you!

AndrewSmith

The outline colour picker isn't a criticism (and I knew it was there).  Just taking you through my thinking process for what I have generated and I how I arrived there.  100% back is a good default value.  Same also for the contrast between text and background - just showing my thinking from a designer background.  This is merely what I was doing.  Sorry if it's coming across as a criticism.  

I agree that you definitely don't want AI involved.  Further, that a template can only be a generalised item at best.

Completely understand about rendering artefacts from dropping the alpha channel ("flattening" in Photoshop speak).  I don't think that extra channel is going to bother anyone.  It's merely that I noticed it was there. 

Yes, I have used that button that clears the image cache.  It works well.  :-)  I was merely thinking about the later on-demand image generation time for anyone on a slow server (and your comment elsewhere about images with drop shadows taking up to 30 seconds to generate - hence my timings are very good) and the option to negate that by proactively regenerating all images ahead of time.  But it's not a problem for me as I am on a fast server.

Andrew

nicholas
Akeeba Staff
Manager

Oh, I improved the drop shadow implementation to be much faster. The 30 seconds were a first attempt. There were better ways in ImageMagick (it has a seldom-used shadow layer feature) and GD (apply the Gaussian blur on an alpha mask) which worked much faster.

Nicholas K. Dionysopoulos

Lead Developer and Director

🇬🇷Greek: native 🇬🇧English: excellent 🇫🇷French: basic • 🕐 My time zone is Europe / Athens
Please keep in mind my timezone and cultural differences when reading my replies. Thank you!

AndrewSmith

This really is such a great little extension.  So glad you did it. 

I will test it on a J6 site that I have.

Andrew

nicholas
Akeeba Staff
Manager

Mad props go to my wife who had the idea and came up with the original set of controls. Unfortunately, her web design studio went out of business which is how I ended up inheriting the software and going forward with all the features we wanted to implement but didn't have the time to.

Nicholas K. Dionysopoulos

Lead Developer and Director

🇬🇷Greek: native 🇬🇧English: excellent 🇫🇷French: basic • 🕐 My time zone is Europe / Athens
Please keep in mind my timezone and cultural differences when reading my replies. Thank you!

Support Information

Working hours: We are open Monday to Friday, 9am to 7pm Cyprus timezone (EET / EEST). Support is provided by the same developers writing the software, all of which live in Europe. You can still file tickets outside of our working hours, but we cannot respond to them until we're back at the office.

Support policy: We would like to kindly inform you that when using our support you have already agreed to the Support Policy which is part of our Terms of Service. Thank you for your understanding and for helping us help you!