html - How do I replicate this effect?

Question

I'm looking for a way to replicate this effect in HTML/CSS. I thought it'd be as simple as setting a radial gradient as the background, then putting a transparent darker overlay and just making the buttons and such white but transparent, yet it doesn't give nearly the same effect.

This is the effect I'm trying to replicate:

Anyone who's smart with CSS happen to know how to achieve this? I've looked all over and haven't found any methods that aren't insanely convoluted workarounds that barely work for one browser. Multi-browser capability is optional, I mainly care about chrome and firefox.

Thanks in advance!

EDIT: To make things even tricker, yes this is a radial gradient, I posted kind of a bad picture. Here's a better example:

Answer 1

文本/图像具有叠加的混合模式。无论背景渐变方向如何，文本和按钮都会“适应”它。

mix-blend-mode: overlay;

我用列表元素重新创建了一个快速演示。希望你觉得它有用。

http://codepen.io/aarjithn/pen/WQyLNz?editors=010