Как сделать прозрачный треугольник в css?

Question

[viva cristo64]

Мне нужно сделать такую кнопку с треугольником снизу как на картинке. Заранее спасибо (кнопку можно не делать, с ней проблем нет, только треугольник)
В интернете не нашёл ответа как сделать именно ПРОЗРАЧНЫЙ треугольник

Comments

[Василий Банников]

А что если через SVG? Или какой-нибудь clip-path?

[viva cristo64]

Василий Банников, Пытался, но не знаю как

[Василий Банников]

MaminProgrammist, имею в виду, что рисовать не один только треугольник, а всю фигуру целиком.
https://bennettfeely.com/clippy/
Сам далёк от фронта, но кажется, что с помощью этого это возможно.

[Василий Банников]

MaminProgrammist, посмотрел ещё, как в VK похожий элемент сделан. Там треугольник тоже отдельно идёт, но он реализован как-то через ::after и border, Но как это работает я не понял

[viva cristo64]

Василий Банников, Ты конечно не дал решение моего вопроса, но спасибо, что попытался

[Василий Банников]

MaminProgrammist, не* дал.
По тому я и пишу в комментарии, что это не ответ, а просто направление, куда можно посмотреть.

[wadowad]

Можно спозиционировать вниз основного элемента квадратный псевдоэлмент, задать ему белую внутреннюю тень, смещённую влево и вверх на 2 пикселя и повернуть псевдоэлемент на 45 градусов.

Answer 1

[Smirator]

Привет, вот тут подробно описано:
https://html5book.ru/css-figury/

Используй гайд + сделай одну границу прозрачной. Должно получиться.