Utiliser un dégradé

by Luckypouet

HTML

<!-- Learn about this code on MDN: https://developer.mozilla.org/fr/docs/Web/CSS/border-image -->

<div id="gradient">
  L'image formée par le gradient est étirée pour remplir la zone.
</div>

CSS

body{
  background: #FCC;
}
#gradient {
  display: flex;
    width: 100%;
    height: 200px; /* to set the div visible, since without height it won't display if it does not have any elements inside */
    border: double 4px transparent;
    border-radius: 25px;
    background-image: radial-gradient(circle at top left, #ef1eef,#163ae0);
    background-origin: border-box;
    background-clip: border-box;
}