Grainy invoice logo

I uploaded the web-sized (467x300) transparent, non-interlaced, PNG version of my company logo to Invoice Ninja and it looked good on the invoices and was also scaled appropriately in the client portal; however was full size in email notices. I see in the code it is set to “fit” to 120x80. I resized logo to 125x80 and changed the code to match, but the logo came out grainy when the invoice was printed. I then tired removing the “fit” so it would display the full image; however it was still grainy.

It seems like I need to upload a higher resolution logo and then scale it down in the code to get a sharp looking invoice, but if I do this the email notices are too big. How to correct this?

Which mail client are you using? If you’re using Apple Mail this may help.

https://apple.stackexchange.com/questions/250967/how-to-stop-images-in-apple-mail-signature-is-being-magnified

The grainy logo is appearing in the PDF invoice. The over-sized logo (which is its actual size, so this makes sense to me) is in the invoice email. I use Outlook and also appears this was in Exchange/Outlook Web.

Can you email the image files to contact@invoiceninja.com

Done. Thanks

I don’t see the email, can you please resend.

Thanks for sending the image files.

It works correctly in my tests (I use Google Inbox) but I found this thread which references Outlook.

https://stackoverflow.com/questions/20989897/image-style-height-and-width-not-taken-in-outlook-mails

Try adding height="50" in the following line.

https://github.com/invoiceninja/invoiceninja/blob/master/resources/views/emails/partials/account_logo.blade.php#L6

I am a little lost. The logo is displaying its actual size in Outlook, I just have to use a larger logo to get it not to look grainy in my invoices. I would like to fix the root cause of this so I can upload the proper size logo for invoices without scaling it down and then it will also be the correct size for email/Outlook.

I am not sure what code segments you are suggesting I change. Is this the code for the emails? If so, where is that found??

Are you self-hosting the app or using invoiceninja.com?

invoiceninja.com

Great, the fix will be included with our next release on Sunday.

Excellent, just to clarify if I upload my 125×80 logo and change the code to match it will not appear grainy on invoices and will stay actual size 125×80 in the email messages?

If you upload the larger logo it should work correctly in both places.

If you still see the problem after Sunday let us know and we’ll continue to work on it.

This appears to be corrected, the oversized image file looks better in PDF format when it is fit to the size set in the design code. It also is scaled appropriately in the email notifications and client portal. Thanks.

Great to hear, thanks for letting us know!

on this topic I’m having an issue with gmail resizing the logo image incorrectly. The emails look perfect in outlook, they even look good in outlook when forwarded from gmail. but when viewed from within gmail the logo is skewed. Figured it was a gmail issue and not much can be done.

I had that same issue with the logo looking squished in gmail, I edited the file mentioned above by Hillel:

https://github.com/invoiceninja/invoiceninja/blob/master/resources/views/emails/partials/account_logo.blade.php#L6

and removed the “max-width:140px;” part, solved my issue!