Html 曲线符号的CSS3

我正在为下面的形状寻找css代码，我已经尝试使用边界半径，但必须为上边界和左曲线使用不同的div。 我正在寻找的css绘制完整的形状如下。有什么帮助吗

曲线{
顶部：25px；
左：25px；
宽度：50px；
边框：实心1px#4C5D65；
高度：86px；
内容：“；
填充：0px；
位置：绝对位置；
变换：旋转（271度）；
边框颜色：透明透明#4C5D65透明；
边界半径：0.051px 99%/44px；
}

可能会改变

边框颜色：透明透明#4C5D65透明到

边框颜色：#4C5D65透明#4C5D65透明

或者在上面添加一个元素，使两者的边距都等于零，然后使底部边框的颜色相同。
希望这对您有所帮助


曲线{
顶部：25px；
左：25px；
宽度：50px；
边框：实心1px#4C5D65；
高度：86px；
内容：“；
填充：0px；
位置：绝对位置；
变换：旋转（271度）；
边框颜色：透明透明#4C5D65透明；
边界半径：0.051px 99%/44px；
}
跨度曲线：之后{
位置：绝对位置；
内容：''；
身高：100%；
宽度：100%；
右边框：1px实心#21262D；
最高：92%；
左-6px；
/*背景：丽贝卡紫*/
}
这里是一个只有一个元素的想法。只需调整梯度，直到你得到你想要的


曲线{
宽度：100px；
高度：50px；
边框顶部：2倍实心；
背景：
径向梯度（左侧100%57%，透明计算（100%-2px），#000，透明100%）
左/15px 100%无重复；
}
请注意，
内容
属性对
曲线
没有任何作用。它必须应用于伪元素选择器。