How to make a widget inside a widget transparent so that the third widget is visible

You can use a ColorFiltered for that.

Stack(
  alignment: Alignment.center,
  children: [
    Container(
      width: 300,
      height: 300,
      color: Colors.green,
    ),
    Material(
      clipBehavior: Clip.antiAlias, // make sure the filter is restricted
      color: Colors.transparent,
      child: SizedBox(
        width: 150,
        height: 150,
        child: ColorFiltered(
          colorFilter: ColorFilter.mode(
            Colors.black, // Color of the box, must be same color as text color used below
            BlendMode.xor,
          ),
          child: Center(
            child: Text(
              'test',
              style: TextStyle(
                fontSize: 32,
                color: Colors.black, // Same color as filter color used above
              ),
            ),
          ),
        ),
      ),
    ),
  ],
);

The BlendMode.xor will cut out everything with the same color within the current canvas, which is the Material widget above it.