Как сделать неровные диагональные линии на HTML Canvas?

Я нашел несколько вопросов о том, как сделать неровные диагональные линии в HTML Canvas более гладкими, но у меня проблема противоположный. То есть я хотел бы иметь возможность установить параметр «неровности», и чтобы отрисованные диагональные линии имели соответствующий уровень детализации.

Я использую Canvas, чтобы создать игру с эстетикой пиксельной графики, и я масштабирую все свои художественные ресурсы и шрифты на 4, так что каждая область 4x4 пикселя на экране визуально соответствует одному пикселю. До сих пор это работало довольно хорошо, но теперь я хотел бы нарисовать некоторый пользовательский интерфейс, используя собственные функции холста, и я хочу, чтобы результаты были визуально согласованы с моим подходом до сих пор. Пока что я пробовал это, но lineWidth влияет только на толщину линии, а не на уровень сглаживания.

ctx.lineWidth=4;
ctx.beginPath();
ctx.moveTo(0,0);
ctx.lineTo(300,150);
ctx.stroke();

Одно из возможных решений - визуализировать серию диагональных блоков, смещенных на 4 пикселя в обоих направлениях, но я надеюсь, что есть что-то более эффективное.