Dark theme navbar: Lighter or darker than the main background?

Question

I don't have a lot of UI/UX experience and am trying to learn as I work on my personal website.

With a light background, I 100% agree with the advice to use a darker navbar, as that helps to sort of visually "anchor" or "hug" the page's contents:

I'm struggling to pick a good color for my navbar in my dark theme, though. Here's what it currently looks like on the same page:

I feel like there isn't enough contrast with the background. Google's material theme guide uses a lighter color for the navbar in dark mode to give the user a sense of elevation. That's what I did with my project cards, and I think it looks good. I tried it out with the navbar:

Two related questions:

1. Does this look worse, or are my eyes inexperienced?

2. Is it inconsistent to have a light theme with a navbar darker than the main background but to have a dark theme with a navbar lighter than the main background?

Answer 1

I also prefer the bottom one, with the lighter navbar. There's more contrast, both for the bar itself and for its shadow.

As for consistency, you could think of the dark theme as generally inverting all the colors, which also flips the relationships, like what happened here.