Jump to content

Search In
  • More options...
Find results that contain...
Find results in...

is it possible to transformOrigin of opacity?

Recommended Posts

hey sorry  if this is a very basic question but i could not find a way to change the opacity of an object or a text from a specific origin, 

i have tried autoalpha, alpha, setting the opacity on the h1 and setting it on box div, it wont work , im starting to think maybe setting origin for opacity is not possible,

im trying to reach a fade in effect from the bottom left corner for text,



i am really new to GSAP and i have been loving this tool, i would like to thank this amazing community and also thank creative coding club for introducing me to this tool, 


BTW marry Christmas everyone

See the Pen YzGEBBz by alisa-khodadadi (@alisa-khodadadi) on CodePen

Link to post
Share on other sites

Hi @dr34mo :)


Welcome to the forum.


You'd probably want to use a mask for that effect. Here is a version I made for another forum question using a SVG. It should give you some ideas.

See the Pen EqmxZV by PointC (@PointC) on CodePen


Happy tweening,



  • Like 3
  • Thanks 1
Link to post
Share on other sites


Hey, welcome to the forums @dr34mo


Changing the opacity from a specific origin is not possible, so you'd have to find a workaround to achieve what you want.


What you could do besides using SVG as @PointC hinted to, is tween on an image/div with a gradient, that initially covers your content.


Maybe something like in this example.


See the Pen YzWGBJY by akapowl (@akapowl) on CodePen


  • Like 3
  • Thanks 1
Link to post
Share on other sites

thank you guys for ur awesome answers , I will definitely play around with this new knowledge 😍 

  • Like 2
Link to post
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.