Border-image-source

HTML-CSS
1

why does it just make two rectangles with the color-gradient?

.starter-flames2 {
  position: fixed;
  top: 105px;
  right: 507px;
  border-top: 50px solid transparent;
  border-left: 5px solid;
  border-right: 5px solid;
  transform: rotate(190deg);
    border-image: linear-gradient (190deg, yellow, white, yellow, orange);
}
.flame-color {
  border-image-source: linear-gradient(0deg, yellow, white, yellow, red);
2

I’ve edited your post for readability. When you enter a code block into a forum post, please precede it with a separate line of three backticks and follow it with a separate line of three backticks to make it easier to read.

You can also use the “preformatted text” tool in the editor (</>) to add backticks around text.

Pre-formatted-text
Pre-formatted-text1356×380 401 KB

See this post to find the backtick on your keyboard.
Note: Backticks (`) are not single quotes (’).

3

I’m not really sure what you’re trying to do, but if the plan is to create a shape by using border-properties on an element with zero width, I don’t think that’s possible with border-image.