The problem with brightness()

dabblet.css

/**
 * The problem with brightness()
 */

body {
	display: flex;
}

div {
	width: 150px;
	height: 150px;
	background: hsl(210, 50%, 30%);
	color: white;
	padding: 25px;
}

div:nth-child(1) {
	filter: brightness(250%);
}

div:nth-child(3) {
	background: hsl(210, 50%, 80%);
}

dabblet.html

<div>filter: brightness(250%)</div>
<div>original color</div>
<div>lightness *= 2.5</div>

dabblet.js

// alert('Hello world!');

settings.json

{"view":"split-vertical","fontsize":"100","seethrough":"","prefixfree":"","page":"all"}