How to hide the arrow in the summary tag in details tag

Posted on January 13, 2022

So you have this markup:

<details>
    <summary>Title</summary>
    <p>Text .... </p>
</details>

and here the CSS to hide the default arrow in the summary tag:

details > summary {
  list-style: none;
}

details summary::-webkit-details-marker {
  display:none;
}