JSFiddle - React, Tailwind, and code Playground

HTML

<!-- source: http://stackoverflow.com/questions/26336585/three-js-webgl-x-ray-effect -->
<script id="XrayVertexShader" type="x-shader/x-vertex">
        uniform float p;
        varying float intensity;
        
        #include <clipping_planes_pars_vertex>
        
        void main()
        {
        	#include <begin_vertex>
            
            vec3 vNormal = normalize( normalMatrix * normal );
            intensity = pow(abs(1.0 - abs(dot(vNormal, vec3(0, 0, 1)))), p);
            
            #include <project_vertex>
            #include <clipping_planes_vertex>
        }
</script>
<script id="XrayFragmentShader" type="x-shader/x-vertex">
        uniform vec3 glowColor;
        varying float intensity;
        
        #include <clipping_planes_pars_fragment>
        
        void main()
        {
        	#include <clipping_planes_fragment>
            
            vec3 glow = glowColor * intensity;
            gl_FragColor = vec4( glow, 1.0 );
        }
</script>
<script src="https://threejs.org/build/three.js"></script>
<script src="https://threejs.org/examples/js/controls/OrbitControls.js"></script>

JavaScript

var scene = new THREE.Scene();
var camera = new THREE.PerspectiveCamera(75, window.innerWidth/window.innerHeight, 0.1, 1000);
var controls = new THREE.OrbitControls(camera);

var renderer = new THREE.WebGLRenderer();
renderer.setSize(window.innerWidth, window.innerHeight);
renderer.localClippingEnabled = true;
document.body.appendChild(renderer.domElement);

var plane = new THREE.Plane(new THREE.Vector3(0, 0, 1), 0.2);
var helper = new THREE.PlaneHelper( plane, 4, 0xffff00 );
scene.add( helper );

var geometry = new THREE.BoxGeometry(1, 1, 1);
var material = new THREE.MeshStandardMaterial({
	color: 0x00ff00,
	clippingPlanes: [plane]
});

var xrayMaterial = new THREE.ShaderMaterial({
    uniforms: {
        p: {type: "f", value: 2},
        glowColor: {type: "c", value: new THREE.Color(0x84ccff)},
    },
    vertexShader: document.getElementById('XrayVertexShader').textContent,
    fragmentShader: document.getElementById('XrayFragmentShader').textContent,
    side: THREE.DoubleSide,
    blending: THREE.AdditiveBlending,
    transparent: true,
    depthWrite: false,
    clipping: true,
    clippingPlanes : [plane]
});

var cube1 = new THREE.Mesh(geometry, material);
//scene.add(cube1);
var cube2 = new THREE.Mesh(geometry, xrayMaterial);
cube2.position.x = 2;
scene.add(cube2);

var aLight = new THREE.AmbientLight(0x404040, 5);
scene.add(aLight);

camera.position.z = 5;
camera.position.x = 1;
camera.position.y = 1;

var render = function () {
    requestAnimationFrame(render);
    controls.update();
    renderer.render(scene, camera);
};

render();