這個問題和這個問題相似

我想建立一個直角三角形，旁邊是一個正方形，可以根據父對象的高度調整大小。而且，箭頭的指針應該略圓，像這樣:

一旦變大，三角形應該保持它的形狀，就像這樣:

也許這能幫到你！！

body {
  display: grid;
  place-items: center;
}

.container {
  --size: 200px;
  display: flex;
}

.box {
  width: var(--size);
  height: var(--size);
  background-color: pink;
}

.triangle {
  --isosceles-size: calc(var(--size) / 2);
  
  border-top: var(--isosceles-size) solid transparent;
  border-bottom: var(--isosceles-size) solid transparent;
  border-left: var(--size) solid lightgreen;
}

<div class="container">
  <div class="box"></div>
  <div class="triangle"></div>
</div>