#Image is bolder than what is supposed to be?

20 messages · Page 1 of 1 (latest)

thin gazelle
#

Hello guys,

I have a picture that I put on a theme (I'm using Shopify) and I don't why but the image on the website is "bolder" than the source image. Do you know why and how can I fix that? The css that I put for the image is this one:
".authentic-stamp-desktop {
display: block;
position: absolute;
z-index: 2;
right: 30px;
width: 115px;
top: 165px
}"

Thanks for your help 🙂

fathom wasp
#

Mhh thats interesting

#

The css shouldn't be able to make it bolder

#

Are you sure it's the same source file?

thin gazelle
#

Yes, it's taking the file from there, I saw somethere that maybe it can be an issue about resolution of the picture

thin gazelle
#

If you see, the letters and the stoke is not exactly the same on the "Stamp_Desktop_Homepage" that you have on the right of the screen shot compare to the image that you have at the top of the "Sale"

#

It's the same picture but in the actual website it doesn't feel the same because the stokes are a bit "bigger"

#

Especially if you look at the "AAA"

deft girder
#

is the image itself transparent

#

i mean other than the text and the logo

#

oh i think i know

#

the one on the left is smaller than the one on the right

#

therefore the computer squishes the pixels to fit

#

making it bolder

thin gazelle
#

Hi ethan! Yes it's a png and yes the source image is bigger than the size render on the website

#

I see I will try to have the same size then, thanks for your help 🙂

green dagger
green dagger
# thin gazelle Hi ethan! Yes it's a png and yes the source image is bigger than the size render...

there are several css image filter which you can sue to modify the image like grayscale if you want to view all of them you can got to https://coderpad.io/blog/development/everything-you-need-to-know-about-all-11-css-filters/

CoderPad

CSS, the language for visually styling elements on the web, has evolved to include features that can change an element’s visual effects in a website’s source

green dagger