I need a tool that allows me to design how a PDF file would look like in a web page. Something simple the image below, I would like to design using some visual tool, export to HTML/CSS and then just fill the fields in my backend. Is this possible?
I would template your workflow with InDesign by creating a standardized CSS you can import and default paragraph and character styles. You can then output as a PDF for the approval process and HTML. However, be advised if you start adding tidbits to the character and paragraph styles it will make your CSS convoluted.
Another solution could be generating in XML and use many tools you can research on converting XML to PDF then bring it into InDesign as IDML but this would probably require Adobe's InDesign SDK and you have to go through an approval process now which, if I recall, it took three weeks before I was approved.
If I may be missing something by your question please let me know and I will go into further detail with my answer.
Adobe Muse is a WYSIWYG (What You See Is What You Get) editor. It allows the designer to create web pages without coding. It exports the code to HTML and CSS. I don't think Muse has a built-in feature for saving as a PDF though (unless you print to a PDF).
Photoshop to Muse
Designers can also design a page in Photoshop and then place that Photoshop file into Muse. Using this method would allow the designer to create the design in Photoshop, save it as a PDF in Photoshop, and then import the design into Muse and export as HTML & CSS. Since you need a PDF, this may be your best method.