The CSS Inlining transformer auto converts embedded CSS into inline CSS. You can turn this on by opening the Transformers tab above the editor and enabling Inline CSS.
Silent video of the full Parcel window. A sample email is displayed in the editor and the Preview. The email contains embedded styles. The user navigates to and opens the Source window in the bottom right, which reveals the same HTML code as seen in the editor. At the top of the editor are five tabs, labeled: "HTML", "Text", "AMP", "Message Details", and "Transformers". The user clicks on the Transformers tab, which replaces the code editor with the transformers pane. The Transformers pane has four sections: "Framework", "CSS Inlining", "Formatting", "URL Parameters", and "CSS Cleanup". The user clicks on the CSS Inlining section, revealing a single toggle switch. The switch is off and labeled "Inline CSS - Whether to inline your embedded CSS". The user turns the switch on, and many additional switches appear with further potential customizations. The embedded CSS in the Source window is replaced with inline CSS.
Screen recording demonstrating the CSS Inline transformer
Once Inline CSS is enabled, you'll have access to a further set of customizing toggles. You can enable/disable any of these as fits your needs. The state of those toggles will be remembered and maintained if you deactivate and later reactivate the CSS Inlining transformer.
Any style tab with data-embed or data-ignore-inlining attributes will not be inlined.