I'm currently developing a resume builder application that features several templates made using React and Tailwind CSS, similar to some popular templates out there. I've successfully implemented a PDF export using `react-pdf/renderer`, but now I want to enable exporting these resumes as editable `.docx` (Word) files while keeping the layout and styling intact. I've explored libraries like `html-to-docx`, but they struggle with modern CSS, including flexbox and Tailwind classes. Is there a good library for converting Tailwind styles to DOCX that works well? I noticed that some templates are directly usable in Word and Google Docs, and I wonder if they were created with DOCX from scratch and then converted to HTML.
4 Answers
There's no perfect way to convert Tailwind to DOCX since DOCX isn’t a web environment. The best method I’ve seen involves using DOCX-first templates and then merging data with tools like docxtemplater or docx. If you want to try HTML-to-DOCX, `@/turbodocx/html-to-docx` is decent, but you'll need to keep your HTML simple—think tables and fixed widths instead of flex or grid.
You might want to check out Pandoc; it’s a powerful tool for document conversions. It might help with the format you’re looking for.
Keep in mind that the CSS capabilities in Word and the DOCX standard are pretty limited. You might have to sacrifice some modern layout techniques; it often feels like going back to IE4 compatibility just to make things work.
The truth is, converting modern CSS to DOCX will usually result in some loss of formatting. A solid strategy I’ve used is to create your resume twice: once in your nice React/Tailwind setup for PDF, and another with a more simplistic structure designed for Word using libraries like docx.js or python-docx. It's not glamorous, but it definitely does the trick.
Thanks for the advice!
So does this mean the templates from sites like beamjobs might be originally created in DOCX and later converted to HTML?