How is it done?

Question

css

Tooltip "triangle", which is part of the image. How?
UPD I know how to make a triangle and how to position it, how does the right piece of the photo appear in the triangle?

Answer 1

If it's not svg, but it's most likely svg, then it's css clipping and masks. Read here .

Answer 2

We just made a triangle in CSS, applied it to the second block, glued it together. And then the effect was brought out through hover. That's it. Pure CSS.

Answer 3

sort of like this:

<div class="field">
 <div class="triangle"></div>
 <div class="content"></div>
</div>

and then css with positioning comes into
play