
👋 Oi, mga repapips, Brian Dys here! I love music, photography, and creative stuff like UX design and art. This is a place where I collect my thoughts and works. Apart all these, I’m Jaycelle’s better half and Bryce’s dad. 🥰
Two of the ways in which you can show an illusion of a button being pressed are: darkening the background-color
and nudging its vertical position.
See the Pen Press Time by Brian Dys Sahagun (@briandys) on CodePen.
It is important to provide for a hint when a user activates an element in your user interface (in this example, a button). The feedback assures the user that the element “responds” to his action.
The advantage of using transform: translateY
is that it does not affect the elements around it (unlike using margin
or padding
).