← back to Marketing Command Center

assets/tiktok-app-icon/icon.html

25 lines

<!doctype html><html><head><meta charset="utf-8">
<link href="https://fonts.googleapis.com/css2?family=Cormorant+Garamond:wght@600;700&display=swap" rel="stylesheet">
<style>
  html,body{margin:0;padding:0}
  /* 1024x1024 opaque app icon — the DW Marketing brand mark (style.css .brand .logo) scaled up.
     Gold gradient ground + ink DW monogram in Cormorant Garamond, with a hairline inner frame. */
  .icon{
    width:1024px;height:1024px;box-sizing:border-box;
    background:linear-gradient(150deg,#c79b60 0%,#b8925a 42%,#9c773f 100%);
    display:grid;place-items:center;position:relative;overflow:hidden;
  }
  /* subtle top-light sheen for depth */
  .icon::before{content:"";position:absolute;inset:0;
    background:radial-gradient(700px 520px at 50% -8%, rgba(255,250,240,.45), rgba(255,250,240,0) 60%);}
  /* hairline inner frame in ink */
  .frame{position:absolute;inset:78px;border:3px solid rgba(20,17,15,.55);border-radius:64px;}
  .dw{font-family:"Cormorant Garamond",Georgia,serif;font-weight:700;color:#14110f;
    font-size:400px;line-height:1;letter-spacing:0;text-shadow:0 6px 18px rgba(20,17,15,.18);
    position:relative;z-index:2;transform:translateY(-14px);}
  .tag{position:absolute;bottom:118px;left:0;right:0;text-align:center;z-index:2;
    font-family:"Cormorant Garamond",Georgia,serif;font-weight:600;color:#14110f;
    font-size:58px;letter-spacing:14px;text-transform:uppercase;opacity:.82;}
</style></head>
<body><div class="icon"><div class="frame"></div><div class="dw">DW</div><div class="tag">Marketing</div></div></body></html>