创意预览图

画面中心是一轮巨大的发光的月亮,弯弯的月亮,不是满月,月亮的下沿上坐着一个英国绅士,他的大小只有月亮的五分之一,向左上方望去,他头发凌乱,身穿邋遢的衬衫,手里握着一只油画画笔,深蓝色背景,灵感来自于名著《月亮与六便士》

用户头像

日勿曰成

2025.09.02
<div class="bg-container"> <div class="moon"></div> <div class="tree"></div> <div class="old-man"></div> <div class="campfire"></div> </div> <style> .bg-container { width: 1080px; height: 1920px; /* 抖音常用竖版比例 */ background: linear-gradient(to bottom, #0a1a30 0%, #0a0e17 100%); position: relative; } .moon { width: 150px; height: 150px; background: radial-gradient(circle, #f9f3c8 30%, transparent 70%); border-radius: 50%; position: absolute; top: 10%; right: 15%; filter: blur(2px); } .tree { width: 400px; height: 900px; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 400 900'%3E%3Cpath fill='%23333' d='M200,0 Q250,300 150,500 T200,900 L250,900 Q180,500 250,300 Z'/%3E%3C/svg%3E"); position: absolute; bottom: 0; left: 50%; transform: translateX(-50%); } .old-man { width: 180px; height: 220px; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 180 220'%3E%3Cpath fill='%23111' d='M90,0 Q120,50 100,120 L80,220 L100,220 Q110,150 90,120 Z'/%3E%3C/svg%3E"); position: absolute; bottom: 150px; left: 50%; transform: translateX(-30%); } .campfire { width: 30px; height: 50px; background: radial-gradient(circle, #ff9d00 0%, transparent 70%), linear-gradient(to top, #ff6a00 0%, #ff9d00 50%, transparent 100%); position: absolute; bottom: 160px; left: 50%; transform: translateX(20%); border-radius: 50%; animation: flicker 1.5s infinite alternate; filter: blur(1px); } @keyframes flicker { 0% { opacity: 0.7; height: 50px; } 100% { opacity: 1; height: 70px; } } </style><div class="bg-container">
  <div class="moon"></div>
  <div class="tree"></div>
  <div class="old-man"></div>
  <div class="campfire"></div>
</div>

<style>
.bg-container {
  width: 1080px;
  height: 1920px; /* 抖音常用竖版比例 */
  background: linear-gradient(to bottom, #0a1a30 0%, #0a0e17 100%);
  position: relative;
}

.moon {
  width: 150px;
  height: 150px;
  background: radial-gradient(circle, #f9f3c8 30%, transparent 70%);
  border-radius: 50%;
  position: absolute;
  top: 10%;
  right: 15%;
  filter: blur(2px);
}

.tree {
  width: 400px;
  height: 900px;
  background: 
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 400 900'%3E%3Cpath fill='%23333' d='M200,0 Q250,300 150,500 T200,900 L250,900 Q180,500 250,300 Z'/%3E%3C/svg%3E");
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
}

.old-man {
  width: 180px;
  height: 220px;
  background: 
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 180 220'%3E%3Cpath fill='%23111' d='M90,0 Q120,50 100,120 L80,220 L100,220 Q110,150 90,120 Z'/%3E%3C/svg%3E");
  position: absolute;
  bottom: 150px;
  left: 50%;
  transform: translateX(-30%);
}

.campfire {
  width: 30px;
  height: 50px;
  background: 
    radial-gradient(circle, #ff9d00 0%, transparent 70%),
    linear-gradient(to top, #ff6a00 0%, #ff9d00 50%, transparent 100%);
  position: absolute;
  bottom: 160px;
  left: 50%;
  transform: translateX(20%);
  border-radius: 50%;
  animation: flicker 1.5s infinite alternate;
  filter: blur(1px);
}

@keyframes flicker {
  0% { opacity: 0.7; height: 50px; }
  100% { opacity: 1; height: 70px; }
}
</style>