Hi @hattiefawcett,
great ideas to create a custom form and copy/pasting the source code into your page. But they won’t work since any pref-center (regardless which tool you use) is always tool-specific.
May I ask you why you’re trying to embed the pref-center on an external page?
@Jnix284 is totally right - the URL to the pref-center is always user-specific and this can’t/shouldn’t be reverse engineered at any time in any way.
Just in advance: I do not want to spread fear or something like that but messing with the pref center is something that no developer should do. Just imagine follwing case: something goes wrong and one of the contacts sues you/your company over something the error(you never know who you’re dealing with)… You really don’t want to be responsible for this.
I strongly advise you not to try to “hack the pref-center” since this could lead to a lot of technical and legal problems.
Also - there’s a good reason why even we developers are technically not able to edit the pref-center module. If we could, we would need to be made responsible for everything pref-center related. And this is just not feasable.
If you’re trying to get the pref-center the easiest, safest and most common solution would be to modify an existing theme or create your own custom one so that the pref-center will match your companys look&feel. I’d say that almost every company which is using HubSpot (or even any other Marketing-Automation tool) does that. The few ones who doesn’t do that don’t care about the look&feel of the pref-center 
If you’re working with a HubSpot partner agency ask them about creating a custom pref-center.
If you don’t work with a HubSpot partner or they don’t have developers and would like to have a custom theme with a pref-center with your companys look&feel - drop me a DM; I’ll be happy to chat about this in detail.
Hope that helps
best,
Anton