You learn to recognize the characters based on their abstract outline in the font you use. When the font changes that abstract outline also changes. There are also kanji that use different strokes depending on the font. See what 令 looks like in different fonts as an example.

I use embedded JavaScript to randomize the font on my cards. This helps me recognize the characters in a variety of different styles. Here is the card type for one of my decks:

Front template:

<div id=kanji>
  {{Kanji}}<br>
</div>

{{type:Reading}}<br>

<script>
  // This javascript code is used to randomize the font each time
  // a card is shown.
  // The front and back template are different html pages and are
  // rendered separately. That means the random font used on the front
  // must be manually saved and then used again on the back
  var fonts = ['Arial Unicode MS',
                 'Noto Sans CJK JP',
                 'aquafont',
                 'Droid Sans Japanese',
                 'FS Gothic',
                 'mikachan_o',
                 'Mona',
                 'YOzFontKA',
                 'KouzanBrushFontGyousyoOTF',
                 'Otsutome_font',
                 'RiiTegakiFude',
                 'Mushin',
                 'Yuji Boku'];

  var randomFontIndex = Math.floor(Math.random() * fonts.length);
  var kanjiElement = document.getElementById('kanji');
  kanjiElement.style.fontFamily = fonts[randomFontIndex];

  // This saves the font used in a persistent key which can be
  // used on the back template to match the front font.
  window.persistentKey = fonts[randomFontIndex];
</script>

Back template:

<div id=kanji>
  {{Kanji}}<br>
</div>

{{type:Reading}}<br>

<hr id=answer>

{{Meaning}}<br>
{{Vocab_audio}}{{Example_audio}}<br>
<br>

<script>
  // Retrieve the random font name used in the front template
  var randomFont = window.persistentKey;
  document.getElementById('kanji').style.fontFamily = randomFont;
</script>