How can I determine which font file is being used, not just the font family?

In Chrome there is no way to know which font file is loaded but you can get good hints by check out the "Rendered Fonts" in "Computed" tab and then check font files name in "Application" tab

check Rendered Fonts:

check font files name:

• Open Chrome DevTools (Right click > Inspect)
• Go to Sources tab
• Look for the font folder (if you're using Google Font, go to ☁fonts.gstatic.com)
• Open subdirectories if any, you'll get the actual font file being used

To answer my own question, Nikul Khatik gave the correct answer. Chrome dev tools doesn't support this feature, but Firefox's does:

So use Firefox to get the actual font face that's used for an element.