영상 튜토리얼: Figma로 HTML 이메일에 Outlook 호환 그라디언트 버튼 추가하기

Figma Emailify 플러그인으로 HTML 이메일에 Outlook과 호환되는 둥근 그라디언트 버튼을 추가하는 방법을 보여 주는 영상이에요.

Figma에서 레이어의 “Fill” 속성을 선형 또는 방사형 그라디언트로 설정하면 Emailify의 Button 레이어에 그라디언트 배경을 추가할 수 있어요. Button을 HTML로 내보낼 때 그라디언트 배경이 자동으로 추가돼요.

Emailify에서 내보낸 그라디언트 버튼 배경은 대부분의 이메일 클라이언트(Outlook 포함)에서 지원되지만, 그라디언트 배경을 지원하지 않는 이메일 클라이언트에서는 Figma 그라디언트 채우기에 사용한 첫 번째 단색으로 대체돼요. 그러니 지원되지 않는 경우(예: Yahoo! Mail)를 위해 그 색상이 적절한 단색 대체 색상인지(버튼 텍스트 색상과 대비가 충분한지) 확인하세요.

그라디언트 버튼 코드는 MJML 내보내기에는 포함되지 않고, 이를 위한 추가 Outlook 코드는 SendGrid 내보내기에 포함되지 않는다는 점에 유의하세요. 각각 이런 향상 기능에 필요한 추가 코드를 지원하지 않기 때문이에요.