That's not the point of typography or design. People are used to Comic Sans. That doesn't make it a good choice. Some designs call for something that stands out in a unique way.
If you are going to the trouble of finding an "atmosphere" for your site and researching the fonts you are using then why just throw that all out with a "stack" and sort of kind of but not really getting it right?
Here's the bigger problem. No two fonts have the same font metrics. Go to the Github page: https://github.com/system-fonts/modern-font-stacks#css-font-.... These fonts are all using the same font size, weight, etc. but they are drastically different. Calibri and DejaVu do not render remotely the same. DejaVu might be readable at a certain size where Gill Sans Nova is going to be rather awful. These are all within the same font stack. Even in the "Preview Rendering" you can see it cheated by having the footnote that says "These fonts have been size-adjusted for easier comparison." How are you planning to do that in CSS? You can't.
All this effort is wasted. You can just pick "sans-serif" and let the user use whatever they have set in the browser. That's better anyway, especially for a blog type layout which is the only layout that would make sense and not completely break with a font stack.