My goal is to achieve the following image. However, I am unsure how to achieve the coloration of the numbers. As you can see, part of the number has two different colors associated to it.

There is also a similar effect on this website https://nolook.co.jp/
How can I go about achieving this look? It appears to be possible.
You could use background-clip and a gradient but backgrounds dispatched within 2 containers:
example
span.difColor {
background:linear-gradient(120deg, #F9F4E1 45%, #0F344C 45.5%);
display:inline-block;
font-size:400px;
}
.difColor b {background: linear-gradient(120deg, #5A95BC 45%,#F9F4E1 45.5% );
-webkit-background-clip: text ;
color:transparent;
}
<span class="difColor"><b>20</b></span>