<p>No.</p>
<p>Unfortunately, the links I was going to post are dead (maybe, direct access is prohibited by Github), so I'll just go with images.</p>
<p>It is implemented by <strong>ray casting</strong>, which can be regarded as a simplified version of ray tracing. You can actually inspect the element in your browser with <code>ctrl + shift + C</code> if you are in windows:</p>
<p>The material used (part):</p>
<p><a href="https://i.sstatic.net/L2cTWCdr.png" rel="nofollow noreferrer"><img src="https://i.sstatic.net/L2cTWCdr.png" alt="copilot head material" /></a></p>
<p>and I believe this is the environment map:</p>
<p><a href="https://i.sstatic.net/V0Rk4Fvt.png" rel="nofollow noreferrer"><img src="https://i.sstatic.net/V0Rk4Fvt.png" alt="env map" /></a></p>
<p>The model is rendered with <code>three.js r148</code> engine:</p>
<p><a href="https://i.sstatic.net/mLhOh8sD.png" rel="nofollow noreferrer"><img src="https://i.sstatic.net/mLhOh8sD.png" alt="element view" /></a></p>
<p>If you search for &quot;copilotHead&quot; in the assets of the website, you will find the rendering logic you need in <code>copilotHead.ts</code>, <code>shader/matcap.ts</code> (fragment shader) and <code>shader/mesh.ts</code> (vertex shader).
<a href="https://i.sstatic.net/kZaFo28b.png" rel="nofollow noreferrer"><img src="https://i.sstatic.net/kZaFo28b.png" alt="shaders" /></a></p>

CC BY-SA 4.0
2024-09-15T16:41:56.320Z
Wow! Thanks so much for this insight and answer. I had no idea this was possible within websites.
Amar Srivastava
CC BY-SA 4.0
2024-09-14T02:17:50.247Z
2024-09-14T02:17:50.247Z
Enigmatisms
<p>This may be a dumb question because I'm a complete novice to graphics programming.</p>
<p>I was on the website of Github Copilot today and I noticed that there's a floating head that follows your mouse cursor around. It appears its reflecting static light sources around it, but I'm not sure if these are true reflections or are simply painted on.</p>
<p>You can find the floating head at this URL:</p>
<p><a href="https://github.com/features/copilot" rel="nofollow noreferrer">https://github.com/features/copilot</a></p>
<p>I was going to attach a screenshot of it but it appears that the editor won't let me.</p>

<raytracing><lighting>
Is the Mascot on Github Copilot Enterprise's website "ray-traced"?
Amar Srivastava
# Is the Mascot on Github Copilot Enterprise's website "ray-traced"?

(Asked by: username_0 on 2024-09-13)

This may be a dumb question because I'm a complete novice to graphics programming.

I was on the website of Github Copilot today and I noticed that there's a floating head that follows your mouse cursor around. It appears its reflecting static light sources around it, but I'm not sure if these are true reflections or are simply painted on.

You can find the floating head at this URL:

<https://github.com/features/copilot>

I was going to attach a screenshot of it but it appears that the editor won't let me.

**Tags:** raytracing, lighting


---

## 1 answers

### Answer by username_1 on 2024-09-14. Score: 2

No.

Unfortunately, the links I was going to post are dead (maybe, direct access is prohibited by Github), so I'll just go with images.

It is implemented by **ray casting**, which can be regarded as a simplified version of ray tracing. You can actually inspect the element in your browser with `ctrl + shift + C` if you are in windows:

The material used (part):

[![copilot head material](https://i.sstatic.net/L2cTWCdr.png)](https://i.sstatic.net/L2cTWCdr.png)

and I believe this is the environment map:

[![env map](https://i.sstatic.net/V0Rk4Fvt.png)](https://i.sstatic.net/V0Rk4Fvt.png)

The model is rendered with `three.js r148` engine:

[![element view](https://i.sstatic.net/mLhOh8sD.png)](https://i.sstatic.net/mLhOh8sD.png)

If you search for "copilotHead" in the assets of the website, you will find the rendering logic you need in `copilotHead.ts`, `shader/matcap.ts` (fragment shader) and `shader/mesh.ts` (vertex shader).
[![shaders](https://i.sstatic.net/kZaFo28b.png)](https://i.sstatic.net/kZaFo28b.png)

> **Comments:**
> **username_0**: Wow! Thanks so much for this insight and answer. I had no idea this was possible within websites.  

---

