Azure AD B2C：如何修改Ocean Blue模板的按钮颜色

目前Azure AD B2C的内置模板（包括你用的Ocean Blue）在仪表板里没有直接修改单个按钮颜色的可视化设置，但有个比托管完整自定义模板更省事的办法——直接在用户流里加自定义CSS片段，不用折腾CORS和外部托管。

具体步骤：

• 打开你的Azure AD B2C租户，找到要修改的注册/登录用户流
• 左侧菜单点自定义UI，勾选「使用自定义页面内容」
• 在「自定义CSS」的输入框里，粘贴这段代码：

/* 替换主按钮为绿色，hover状态用深绿 */
.button.button-primary {
    background-color: #2ECC71 !important;
    border-color: #2ECC71 !important;
}
.button.button-primary:hover, .button.button-primary:active {
    background-color: #27AE60 !important;
    border-color: #27AE60 !important;
}

• 保存用户流，测试页面就能看到按钮变成绿色了

如果需要调整绿色的具体色值，直接修改代码里的十六进制颜色码就行，这个方法完全在Azure仪表板内操作，不用额外托管资源。

内容的提问来源于stack exchange，提问作者Shrujan Shetty