How to add CSS Gradient Color Overlay on an Image background -

Поделиться
HTML-код
  • Опубликовано: 7 сен 2024

Комментарии • 68

  • @adewaleabiona2552
    @adewaleabiona2552 3 года назад +6

    This is a great tutorial on how to add gradient color overlay on background image. Very concise and gives optimal result

  • @everythinggames1563
    @everythinggames1563 2 года назад +2

    You just helped me understand gradient in 6 mins. You just earned yourself a subscriber

  • @uberdrivebye5582
    @uberdrivebye5582 2 года назад +1

    I've searched everywhere for a tutorial like this. FINALLY!!!! Thanks! I subscribed.

  • @SheriffKoder9
    @SheriffKoder9 2 года назад +1

    Thank you!! there is a huge difference between putting the image before or after the gradient, this helped me figure it out ! image=after :)

  • @summersoker4044
    @summersoker4044 2 года назад +1

    highly RECOMMENDED video!!! thanks a ton!!! this is the third tutorial I watched and u explained it great!

    • @smashtheshell
      @smashtheshell  2 года назад +1

      Thank you so much for your support! It means a lot to me :)

  • @mutiaraichsan5061
    @mutiaraichsan5061 2 года назад +1

    i like you when you explain...slowly one by one

    • @smashtheshell
      @smashtheshell  2 года назад

      Thank you so much! Making a comeback on this platform very soon. It would be great to hear what other topics you might want me to cover! :)

  • @toderox
    @toderox 2 года назад +1

    best explantion ever... so simple yet useful!!! congratulations!

    • @smashtheshell
      @smashtheshell  2 года назад

      Thank you! It would be great if you could share what other topics you want me to cover here. :)

  • @jessadefiesta7890
    @jessadefiesta7890 2 года назад

    thank you

  • @asifhossain2088
    @asifhossain2088 2 года назад

    thank u bro!!!!!!!!

  • @earlycreations3905
    @earlycreations3905 2 года назад +2

    Superb, this is straightforward and easy tutorial. Kudos bro!

    • @smashtheshell
      @smashtheshell  2 года назад

      Thanks for your kind words! Let me know what else you would like to see from me on this channel? Thank you.

    • @Moodboard39
      @Moodboard39 2 года назад

      @@smashtheshell it doesn't work

  • @rin4961
    @rin4961 2 года назад +1

    OMG THANK YOU SO MUCH! I've tried so many ways, searched in google and nothing helped. Your solution helped me to resolve the problem with only one line!

    • @smashtheshell
      @smashtheshell  2 года назад

      Hey Rina, I am really happy that it helped. Thank you for your feedback 😊

  • @AbhishekSingh-on6bx
    @AbhishekSingh-on6bx 2 года назад

    Nice!!!

  • @ItsRawrTopia
    @ItsRawrTopia 3 года назад +1

    Subscribed! Amazing!

  • @mooomalooomabaloooma
    @mooomalooomabaloooma 3 года назад +2

    This tutorial makes sense made it easy to understand and it was straightforward. Thank you!

    • @marieb4314
      @marieb4314 5 месяцев назад

      please I've tried doing that but it doesn't work

    • @marieb4314
      @marieb4314 5 месяцев назад

      I'm using chrome browser it doesn't work

  • @husseinal-masoodi2445
    @husseinal-masoodi2445 2 года назад

    Thanks

  • @avoybaruah8061
    @avoybaruah8061 2 года назад

    Thanks Brother It help me a lot

  • @fazliddinkhamidullayev4695
    @fazliddinkhamidullayev4695 2 года назад

    very nice video, thank you bro

  • @ione7260
    @ione7260 3 года назад +2

    Nice work its helping me to make better styles

    • @smashtheshell
      @smashtheshell  3 года назад +1

      Great! 😊 Keep learning. I appreciate your feedback bro.

  • @rowilmoran7321
    @rowilmoran7321 3 года назад +1

    Thanks dude!

  • @vikisneakers
    @vikisneakers 3 года назад

    Thank you very much i have solved my problem🤗

  • @justsaybobby
    @justsaybobby 2 года назад

    THANK YOU SOO MUCH FOR THIS VIDEO

  • @olyashulpina2777
    @olyashulpina2777 3 года назад

    Thanks! I will try this and write about the result later)

  • @hectorg362
    @hectorg362 2 года назад

    Thanks for this!

  • @akatski666
    @akatski666 2 года назад

    THANK YOU!!

  • @thelaiq
    @thelaiq 3 года назад +3

    You deserve more likes

  • @priteshpatel1530
    @priteshpatel1530 3 года назад +1

    cool bro it's too help full video for me

  • @ar-world2904
    @ar-world2904 3 года назад

    Thanks man it was so helpful

  • @danielasilva1864
    @danielasilva1864 3 года назад

    This video help me a lot! Thank you so much

  • @mahbubulhaque3137
    @mahbubulhaque3137 2 года назад

    just wow!!!! it makes my work easier

  • @rawcrazycomrade
    @rawcrazycomrade 3 года назад

    Very simple and easy to understand! Thanks!

  • @caH40yc
    @caH40yc 3 года назад

    Thanks!

  • @khatariinsaan5284
    @khatariinsaan5284 2 года назад

    What a Perfect Explanation as I expected :)

  • @peasfulwarrior2452
    @peasfulwarrior2452 3 года назад

    thank you so much mate!👍😎

  • @PodcastDakwah
    @PodcastDakwah 3 года назад

    Thanks a lot.

  • @siawonderswhy
    @siawonderswhy 3 года назад

    thank you so much

  • @AdrianMMable
    @AdrianMMable 2 года назад +1

    How can you apply the gradient to the text. This applies only to the background.

    • @smashtheshell
      @smashtheshell  2 года назад

      Hey, you can refer to this video to apply gradient on text and animate it at the same time: ruclips.net/video/2NxUssDAxoY/видео.html

  • @a1x5h04
    @a1x5h04 2 года назад

    U Can Also Add RGBA values directly ...

  • @usamanayab8381
    @usamanayab8381 2 года назад

    Perfect

  • @smsmsmow4109
    @smsmsmow4109 Год назад

    can i use this with blend ? or mix ?

  • @dwade2563
    @dwade2563 2 года назад +1

    is there something i missed becuase when i type :root in my CSS it doesnt work for me and it just looks like reguler text can you help me

    • @smashtheshell
      @smashtheshell  2 года назад

      Hey sure I can help you with that! Can you please share your code? You can ping me on twitter @iAmitkumar

    • @dwade2563
      @dwade2563 2 года назад

      @@smashtheshell alright il do that thank you

    • @dwade2563
      @dwade2563 2 года назад

      just sent it to you

  • @SarcasmKings
    @SarcasmKings 3 года назад

    How could I use this property of gradient overlay in my weather app......please help me....maine weather forecast app bnaya h angular me by using node Package module (npm)🙏🙏please reply

    • @TeluguTechism
      @TeluguTechism 3 года назад

      Add gradients with respective weather mood...like
      •if it's sunny use a warm gradient
      •if it's cool use a blush gradient
      •if it's thunder use a dark gradient
      Dig into the nature man...u will get lot of ideas🤝

    • @SarcasmKings
      @SarcasmKings 3 года назад

      I have to develop a method and have to apply if condition...... isn't it?

    • @TeluguTechism
      @TeluguTechism 3 года назад

      @@SarcasmKings absolutely 🎉

  • @nicolaschavez8841
    @nicolaschavez8841 2 года назад

    no me salio ;c

  • @Moodboard39
    @Moodboard39 2 года назад

    it dosn't work

    • @smashtheshell
      @smashtheshell  2 года назад

      Hi, I am wondering I come it doesn't work for you. Could you share your code so that I could look into it.

    • @Moodboard39
      @Moodboard39 2 года назад

      @@smashtheshell I will. I did exactly as you did ...picture background wasn't showing .

  • @emirhandemir3872
    @emirhandemir3872 2 года назад

    #FC466B
    #3F5EFB

  • @kazzsingh5656
    @kazzsingh5656 2 года назад

    Thank you