Jump to content
Search Community

Color overlay

Design Newbie test
Moderator Tag

Recommended Posts

I am super new to all this and probably don't even know how to phrase my question with the 'proper lingo' but I am going to try anyways......

 

   How can I put a colored overlay on an image (just a light tint)?

 

(I don't have a codepen example since I don't know how to do it in the first place)

  • Like 1
Link to comment
Share on other sites

1 hour ago, Design Newbie said:

I don't have a codepen example since I don't know how to do it in the first place

That is the great thing about Codepen, you don't need to you can just start and you'll get a live preview of what you're doing!

 

I don't see how this could be a GSAP related question. But you could start by creating two elements, your image and the coloured shape and then search the web on how to overlap two elements in CSS. Hope it helps and happy tweening! 

Link to comment
Share on other sites

I apologize for such dumb questions (as this is not my first) .... and I apologize if some of what I inquire about is not directly related to GSAP directly either. I am just totally lost with all this html, css, javascript stuff that it all seems to just kind mix together for me I guess. 

   And you are right.....this question has nothing to do with animation with GSAP..... I got the wrong forum apparently. Thank you for your time anyways and for still providing solutions!!!

  • Like 1
Link to comment
Share on other sites

Hi @Design Newbie,

 

No need to apologize at all. GSAP forums are a safe and friendly place where we're all teachers and learners, no dumb questions, downvotes or anything of the sort around here.

 

If you're just starting with web development, maybe dive right into GSAP might be a few steps away. I strongly recommend you to get some HTML/CSS/Javascript knowledge first and then getting your mind wrapped around how GSAP works will be super simple. Here you can find great learning resources for free:

https://www.youtube.com/@freecodecamp/featured

 

Happy Tweening!

  • Like 3
Link to comment
Share on other sites

Quote

 I am just totally lost with all this html, css, javascript stuff that it all seems to just kind mix together for me I guess. 


We were all there at one point, no worries! I quite like the 'building a house' analogy.

 

HTML is like the raw building materials - so the bare bones, text elements like h1, h2, h3 etc, img elements, links and buttons
CSS is decoration, styling - it's like painting the house and making it look nice. Think layout and colours and aesthetics.
JS is like plumbing and electricity - functionality, interaction, data

There's always a little overlap but that's a nice baseline to start from.

  • Like 1
Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
  • Recently Browsing   0 members

    • No registered users viewing this page.
×
×
  • Create New...