Coder Wrap provides free to use snippets

/**Typeo CSS Start**/
@import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,400;0,500;0,600;0,700;1,400&display=swap');
*{ box-sizing: border-box;}

/**Typeo CSS End**/
.accordion-list { 
 max-width: 600px !important; 
 width: 100%; 
 margin:3% auto; 
 font-family: Poppins;
}
.accordion-list .accordion-item .acc-label { 
 width: 100%;
 background-color: #e9e9e9;
 position: relative;
 display: inline-block;
 padding: 8px 15px;
 margin-bottom: 2px;
 cursor: pointer;
}

.accordion-list .accordion-item .acc-label:after {
   content: '';
   width: 10px;
   height: 10px;
   border-left: #000 2px solid;
   border-bottom: #000 2px solid;
   position: absolute;
   right: 14px;
   top: 50%;
   margin-top: -10px;
   transform: rotate(-45deg);
}

.accordion-list .accordion-item .acc-label.cw-open:after {
 transform: rotate(135deg);
 margin-top: -3px;
}
.accordion-data {
 overflow: hidden;
 height: 0;
 padding: 0px 15px;
 transition: 0.5s all;
 -webkit-transition: 0.5s all;
}
.accordion-list .accordion-item .cw-open + .accordion-data{
padding-top: 15px;
padding-bottom:15px;
overflow: auto;
 height: auto;
}
.accordion-data h3 { 
 margin: 0px;
}

let items = document.querySelectorAll(".accordion-list .accordion-item .acc-label");
items.forEach(function (t) {
	t.addEventListener("click", function (e) {
	 items.forEach(function (e) {
			e !== t || e.classList.contains("cw-open")
				? e.classList.remove("cw-open")
				: e.classList.add("cw-open");
		});
 });
});