Filter met checkboxen

.wpforms-field > .themes {width: 100%;}

#url:checked ~ p {filter: url();}	
#blur:checked ~ p {filter: blur(3px);}	
#brightness:checked ~ p {filter: brightness(0.6);}	
#contrast:checked ~ p {filter: contrast(4);}	
#drop-shadow:checked ~ p {filter: drop-shadow(2px 2px 5px rgb(0 0 0 / 0.5));}	
#grayscale:checked ~ p {filter: grayscale(0.2);}	
#hue-rotate:checked ~ p {filter: hue-rotate(180deg);}	
#invert:checked ~ p {filter: invert(1);}	
#opacity:checked ~ p {filter: opacity(0.5);}	
#saturate:checked ~ p {filter: saturate(2.2);}	
#sepia:checked ~ p {filter: sepia(0.8);}			

.themes p 
  {
    padding: 1em;
    background-color: #ff6400;
    border-radius: 0.5em;
    color: #fbfbfb;
    transition: 0.2s ease-in;
  }

echo "<div class='wpforms-field'>";
echo "<ul class='themes'>";

echo "<li>";
echo "<input type='checkbox' id='blur' />";
echo "<label for='blur'>Filter blur</label>";
echo "<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quam dolores quod debitis veritatis placeat nemo iste natus maxime.</p>";
echo "</li>";

echo "<li>";
echo "<input type='checkbox' id='brightness' />";
echo "<label for='brightness'>Filter brightness</label>";
echo "<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quam dolores quod debitis veritatis placeat nemo iste natus maxime.</p>";
echo "</li>";
		
echo "<li>";
echo "<input type='checkbox' id='contrast' />";
echo "<label for='contrast'>Filter contrast</label>";
echo "<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quam dolores quod debitis veritatis placeat nemo iste natus maxime.</p>";
echo "</li>";

echo "<li>";
echo "<input type='checkbox' id='drop-shadow' />";
echo "<label for='drop-shadow'>Filter drop-shadow</label>";
echo "<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quam dolores quod debitis veritatis placeat nemo iste natus maxime.</p>";
echo "</li>";

echo "<li>";
echo "<input type='checkbox' id='grayscale' />";
echo "<label for='grayscale'>Filter grayscale</label>";
echo "<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quam dolores quod debitis veritatis placeat nemo iste natus maxime.</p>";
echo "</li>";
			
echo "<li>";
echo "<input type='checkbox' id='hue-rotate' />";
echo "<label for='hue-rotate'>Filter hue-rotate</label>";
echo "<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quam dolores quod debitis veritatis placeat nemo iste natus maxime.</p>";
echo "</li>";

echo "<li>";
echo "<input type='checkbox' id='invert' />";
echo "<label for='invert'>Filter invert</label>";
echo "<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quam dolores quod debitis veritatis placeat nemo iste natus maxime.</p>";
echo "</li>";
			
echo "<li>";
echo "<input type='checkbox' id='opacity' />";
echo "<label for='opacity'>Filter opacity</label>";
echo "<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quam dolores quod debitis veritatis placeat nemo iste natus maxime.</p>";
echo "</li>";

echo "<li>";
echo "<input type='checkbox' id='saturate' />";
echo "<label for='saturate'>Filter saturate</label>";
echo "<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quam dolores quod debitis veritatis placeat nemo iste natus maxime.</p>";
echo "</li>";

echo "<li>";
echo "<input type='checkbox' id='sepia' />";
echo "<label for='sepia'>Filter sepia</label>";
echo "<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quam dolores quod debitis veritatis placeat nemo iste natus maxime.</p>";
echo "</li>";
											
echo "</ul>";
echo "</div>";