самый примитивный вариант
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<input type="text">
<script>
document.querySelector("input").oninput=function(){
if(this.value == 'красный') document.body.style.backgroundColor = 'red';
else if(this.value == 'синий') document.body.style.backgroundColor = 'blue';
else document.body.style.backgroundColor= 'white';
};
</script>
</body>
</html>
если много цветов можно создать массив или объект