Rafkipartama

The next release of Lynk.id must let every Pro or Brandpreneur member turn their public page into a true brand touch-point. I need code, UI, and a smooth onboarding flow that together enable four branding actions:

• Upload a custom logo – PNG/SVG, retina-ready, max 1 MB, instantly previewed on page header and social previews.
• Pick background and accent colours – full colour-picker with HEX/RGB input, live preview, and automatic contrast checking for accessibility.
• Choose fonts – Google Fonts list plus “upload your own” (WOFF/TTF); store selections per user and render through CSS variables for quick theme switching.
• Connect a custom domain – CNAME or A-record wizard, DNS status checker, and automatic SSL via Let’s Encrypt so www.coachyusuf.id (sample from an actual user) resolves cleanly.

Tech context
The existing stack is React + Next.js for the front end, Node.js (Express) with MongoDB for user data, and AWS S3/CloudFront for assets. Please keep to this stack so the new settings panel drops straight into our current code-base.

Acceptance criteria
1. A Pro test account can brand its page in under 3 minutes without refreshing.
2. Custom domain goes live with valid SSL in <10 minutes after DNS propagation.
3. Lighthouse accessibility score stays ≥90 despite any colour choices thanks to contrast guardrails.
4. No regressions for Free plan users; features must remain hidden or show an upgrade prompt.

Source code (well-commented), migration script, and a concise README are the final deliverables. I’ll provide Figma mock-ups and a staging API key once we start.