README.md

nearest neighbor:

default opengl linear:

fancyupscale.glsl:

---

nearest neighbor

default opengl linear:

fancyupscale.glsl:

notes:

the edges are solid pixels, this would likely look better with antialiasing applied

try it out:

go to https://www.shadertoy.com/new

paste the code in the thing

paste this code in the console to be able to choose your own images:

for (let i = 0; i < 4; ++i) {
    d = document.createElement('div');
    d.className = "upload";
    d.innerHTML = '<button onclick="document.querySelector(\'#texture' + i + '>div.upload>div>input\').click()" style="width:100%;">Upload</button>' +
        '<div style="display:none;"><input type="file" accept="image/*"/>' +
        '<p>#</p></div>';
    document.querySelector('#texture' + i).append(d);
    document.querySelector('#texture' + i + '>div.upload>div>input').addEventListener('change', function () {
        if (this.files && this.files[0]) {
            let p = document.querySelector('#texture' + i + '>div.upload>div>p');
            URL.revokeObjectURL(p.innerText);
            p.innerText = URL.createObjectURL(this.files[0]);
            gShaderToy.SetTexture(i, { mSrc: p.innerText, mType: 'texture', mID: 1, mSampler: { filter: 'mipmap', wrap: 'repeat', vflip: 'true', srgb: 'false', internal: 'byte' } });
        }
    });
}

select an image for iChannel0.

fancyupscale.glsl

void mainImage( out vec4 fragColor, in vec2 fragCoord )
{
    vec2 uv = fragCoord;
    
    ivec2 size = textureSize(iChannel0, 0);

    float ratio = float(size.x) / float(size.y);
    uv.y /= float(iResolution.x)/float(iResolution.y);
    uv.y *= ratio;
    uv /= iResolution.xy;
    
    ivec2 pixel = ivec2(uv * vec2(size));
    vec2 pxcoord = vec2(pixel) / vec2(size);
    
    ivec2 px2 = pixel + ivec2(0, 1);
    ivec2 px3 = pixel + ivec2(1, 0);
    ivec2 px4 = pixel + ivec2(1, 1);
    
    vec2 pxcoord2 = vec2(px2) / vec2(size);
    vec2 pxcoord3 = vec2(px3) / vec2(size);
    vec2 pxcoord4 = vec2(px4) / vec2(size);
    
    vec4 col1 = vec4(texture(iChannel0, pxcoord).xyz,1.0);
    vec4 col2 = vec4(texture(iChannel0, pxcoord2).xyz,1.0);
    vec4 col3 = vec4(texture(iChannel0, pxcoord3).xyz,1.0);
    vec4 col4 = vec4(texture(iChannel0, pxcoord4).xyz,1.0);
    vec4 actual = vec4(texture(iChannel0, uv).xyz,1.0);
    
    float min = 10000.0;
    vec4 final;
    
    float dist1 = distance(col1, actual);
    if(dist1 < min) {min = dist1; final = col1;}
    
    float dist2 = distance(col2, actual);
    if(dist2 < min) {min = dist2; final = col2;}
    
    float dist3 = distance(col3, actual);
    if(dist3 < min) {min = dist3; final = col3;}
    
    float dist4 = distance(col4, actual);
    if(dist4 < min) {min = dist4; final = col4;}
    
    //fragColor = actual.x > 0.5 ? vec4(1, 1, 1, 1) : vec4(0, 0, 0, 0);
    
    fragColor = final;
}