skip to Main Content

Using template engine as PUG

Html body

    nav#navbar
        ul.flex-container
          div#logo
              img(src='/static/logo3.png')

enter image description here
This is what image logo3.png looks

enter image description here

Can you suggest any css property?
Or photoshop tool to do it.
Searched but found opacity property which doesn’t help.

3

Answers


  1. Chosen as BEST ANSWER
    1. We can use background remover online tool as Vivek mention.
    2. We can also do it by using css *Invert which changes white background to black. We can also use contrast and other property for it *Css filter function
    #logo img{
        filter: invert(1);
        height: 50px;
         width: 60px;
    }
    

    This is result of invert function enter image description here

    Thanks everyone who helped me in this!


  2. Unfortunately this image is not transparent, you can see the gray and white chessboard pattern in the background.

    I suggest you should use a photo editing app to select the content and delete everything other than the selection.

    Login or Signup to reply.
  3. You should use Google for more of these simplest tasks. This is not the right place to ask these type of questions. You can use an online background remover like https://remove.bg to remove backgrounds if you are not familiar with image editing apps. Btw, here’s your updated image:

    enter image description here

    Login or Signup to reply.
Please signup or login to give your own answer.
Back To Top
Search