Skip to content

Latest commit

 

History

History
214 lines (205 loc) · 8.02 KB

COPY-PASTE-LIST.md

File metadata and controls

214 lines (205 loc) · 8.02 KB

COPYPASTE LIST

because there is no point in literally typing out svg icons lol

Tailwind brand colors

brand: {
    "25": "#F8F9FD",
    "50": "#F0F4FA",
    "100": "#E1E9F6",
    "200": "#C3D3ED",
    "300": "#A5BDE4",
    "400": "#87A7DB",
    "500": "#6991D2",
    "600": "#4B76C9",
    "700": "#3659B1",
    "800": "#284189",
    "900": "#1B2A61",
    "950": "#111A3E",
},
"discord-gray": "#36393f",
"discord-text": "#dcddde",
"discord-timestamp": "#72767d",

DISCORD ICON

<svg
  xmlns="http://www.w3.org/2000/svg"
  viewBox="0 0 127.14 96.36"
  {...props}>
  <path
    fill="currentColor"
    d="M107.7,8.07A105.15,105.15,0,0,0,81.47,0a72.06,72.06,0,0,0-3.36,6.83A97.68,97.68,0,0,0,49,6.83,72.37,72.37,0,0,0,45.64,0,105.89,105.89,0,0,0,19.39,8.09C2.79,32.65-1.71,56.6.54,80.21h0A105.73,105.73,0,0,0,32.71,96.36,77.7,77.7,0,0,0,39.6,85.25a68.42,68.42,0,0,1-10.85-5.18c.91-.66,1.8-1.34,2.66-2a75.57,75.57,0,0,0,64.32,0c.87.71,1.76,1.39,2.66,2a68.68,68.68,0,0,1-10.87,5.19,77,77,0,0,0,6.89,11.1A105.25,105.25,0,0,0,126.6,80.22h0C129.24,52.84,122.09,29.11,107.7,8.07ZM42.45,65.69C36.18,65.69,31,60,31,53s5-12.74,11.43-12.74S54,46,53.89,53,48.84,65.69,42.45,65.69Zm42.24,0C78.41,65.69,73.25,60,73.25,53s5-12.74,11.44-12.74S96.23,46,96.12,53,91.08,65.69,84.69,65.69Z"
  />
</svg>

CODE SNIPPET

`await fetch("http://localhost:3000/api/v1/events", {
  method: "POST",
  body: JSON.stringify({
    category: "sale",
    fields: {
      plan: "PRO",
      email: "[email protected]",
      amount: 49.00
    }
  }),
  headers: {
    Authorization: "Bearer <YOUR_API_KEY>"
  }
})`

VERIFICATION BADGE

<svg
  width="18"
  height="18"
  viewBox="0 0 18 18"
  fill="none"
  xmlns="http://www.w3.org/2000/svg"
  className= {props.className}
>
  <path
    d="M17.7508 9.41667C17.7508 8.1 17.0217 6.95833 15.9608 6.41667C16.0892 6.05417 16.1592 5.6625 16.1592 5.25C16.1592 3.40833 14.7342 1.91833 12.9775 1.91833C12.5858 1.91833 12.2108 1.98833 11.8642 2.12667C11.3492 1.0125 10.2592 0.25 9.00083 0.25C7.7425 0.25 6.65417 1.01417 6.13667 2.125C5.79083 1.9875 5.415 1.91667 5.02333 1.91667C3.265 1.91667 1.84167 3.40833 1.84167 5.25C1.84167 5.66167 1.91083 6.05333 2.03917 6.41667C0.979167 6.95833 0.25 8.09833 0.25 9.41667C0.25 10.6625 0.901667 11.7483 1.86833 12.3217C1.85167 12.4633 1.84167 12.605 1.84167 12.75C1.84167 14.5917 3.265 16.0833 5.02333 16.0833C5.415 16.0833 5.79 16.0117 6.13583 15.875C6.6525 16.9867 7.74083 17.75 9 17.75C10.26 17.75 11.3483 16.9867 11.8642 15.875C12.21 16.0108 12.585 16.0817 12.9775 16.0817C14.7358 16.0817 16.1592 14.59 16.1592 12.7483C16.1592 12.6033 16.1492 12.4617 16.1317 12.3208C17.0967 11.7483 17.7508 10.6625 17.7508 9.4175V9.41667ZM12.2375 6.63833L8.62583 12.055C8.505 12.2358 8.3075 12.3333 8.105 12.3333C7.98583 12.3333 7.865 12.3 7.75833 12.2283L7.6625 12.15L5.65 10.1375C5.40583 9.89333 5.40583 9.4975 5.65 9.25417C5.89417 9.01083 6.29 9.00917 6.53333 9.25417L8.00833 10.7267L11.1958 5.94333C11.3875 5.65583 11.7758 5.58 12.0625 5.77083C12.3508 5.9625 12.4292 6.35083 12.2375 6.6375V6.63833Z"
    fill="#1D9BF0"
  />
</svg>

BACKGROUND PATTERN

<svg
  width="768"
  height="736"
  viewBox="0 0 768 736"
  fill="none"
  xmlns="http://www.w3.org/2000/svg"
  className= {props.className}
>
  <mask
    id="mask0_5036_374506"
    style= {{ maskType: "alpha" }}
    maskUnits="userSpaceOnUse"
    x="0"
    y="-32"
    width="768"
    height="768">
    <rect
      width="768"
      height="768"
      transform="translate(0 -32)"
      fill="url(#paint0_radial_5036_374506)"
    />
  </mask>
  <g mask="url(#mask0_5036_374506)">
    <g clipPath="url(#clip0_5036_374506)">
      <g clipPath="url(#clip1_5036_374506)">
        <line x1="0.5" y1="-32" x2="0.5" y2="736" stroke="#E4E7EC" />
        <line x1="48.5" y1="-32" x2="48.5" y2="736" stroke="#E4E7EC" />
        <line x1="96.5" y1="-32" x2="96.5" y2="736" stroke="#E4E7EC" />
        <line x1="144.5" y1="-32" x2="144.5" y2="736" stroke="#E4E7EC" />
        <line x1="192.5" y1="-32" x2="192.5" y2="736" stroke="#E4E7EC" />
        <line x1="240.5" y1="-32" x2="240.5" y2="736" stroke="#E4E7EC" />
        <line x1="288.5" y1="-32" x2="288.5" y2="736" stroke="#E4E7EC" />
        <line x1="336.5" y1="-32" x2="336.5" y2="736" stroke="#E4E7EC" />
        <line x1="384.5" y1="-32" x2="384.5" y2="736" stroke="#E4E7EC" />
        <line x1="432.5" y1="-32" x2="432.5" y2="736" stroke="#E4E7EC" />
        <line x1="480.5" y1="-32" x2="480.5" y2="736" stroke="#E4E7EC" />
        <line x1="528.5" y1="-32" x2="528.5" y2="736" stroke="#E4E7EC" />
        <line x1="576.5" y1="-32" x2="576.5" y2="736" stroke="#E4E7EC" />
        <line x1="624.5" y1="-32" x2="624.5" y2="736" stroke="#E4E7EC" />
        <line x1="672.5" y1="-32" x2="672.5" y2="736" stroke="#E4E7EC" />
        <line x1="720.5" y1="-32" x2="720.5" y2="736" stroke="#E4E7EC" />
      </g>
      <rect x="0.5" y="-31.5" width="767" height="767" stroke="#E4E7EC" />
      <g clipPath="url(#clip2_5036_374506)">
        <line y1="15.5" x2="768" y2="15.5" stroke="#E4E7EC" />
        <line y1="63.5" x2="768" y2="63.5" stroke="#E4E7EC" />
        <line y1="111.5" x2="768" y2="111.5" stroke="#E4E7EC" />
        <line y1="159.5" x2="768" y2="159.5" stroke="#E4E7EC" />
        <line y1="207.5" x2="768" y2="207.5" stroke="#E4E7EC" />
        <line y1="255.5" x2="768" y2="255.5" stroke="#E4E7EC" />
        <line y1="303.5" x2="768" y2="303.5" stroke="#E4E7EC" />
        <line y1="351.5" x2="768" y2="351.5" stroke="#E4E7EC" />
        <line y1="399.5" x2="768" y2="399.5" stroke="#E4E7EC" />
        <line y1="447.5" x2="768" y2="447.5" stroke="#E4E7EC" />
        <line y1="495.5" x2="768" y2="495.5" stroke="#E4E7EC" />
        <line y1="543.5" x2="768" y2="543.5" stroke="#E4E7EC" />
        <line y1="591.5" x2="768" y2="591.5" stroke="#E4E7EC" />
        <line y1="639.5" x2="768" y2="639.5" stroke="#E4E7EC" />
        <line y1="687.5" x2="768" y2="687.5" stroke="#E4E7EC" />
        <line y1="735.5" x2="768" y2="735.5" stroke="#E4E7EC" />
      </g>
      <rect x="0.5" y="-31.5" width="767" height="767" stroke="#E4E7EC" />
    </g>
  </g>
  <defs>
    <radialGradient
      id="paint0_radial_5036_374506"
      cx="0"
      cy="0"
      r="1"
      gradientUnits="userSpaceOnUse"
      gradientTransform="translate(384 384) rotate(90) scale(384 384)"
    >
      <stop />
      <stop offset="1" stopOpacity="0" />
    </radialGradient>
    <clipPath id="clip0_5036_374506">
      <rect
        width="768"
        height="768"
        fill="white"
        transform="translate(0 -32)"
      />
    </clipPath>
    <clipPath id="clip1_5036_374506">
      <rect y="-32" width="768" height="768" fill="white" />
    </clipPath>
    <clipPath id="clip2_5036_374506">
      <rect y="-32" width="768" height="768" fill="white" />
    </clipPath>
  </defs>
</svg>

COLOR CODES

"#FF6B6B", // bg-[#FF6B6B] ring-[#FF6B6B] Bright Red
"#4ECDC4", // bg-[#4ECDC4] ring-[#4ECDC4] Teal
"#45B7D1", // bg-[#45B7D1] ring-[#45B7D1] Sky Blue
"#FFA07A", // bg-[#FFA07A] ring-[#FFA07A] Light Salmon
"#98D8C8", // bg-[#98D8C8] ring-[#98D8C8] Seafoam Green
"#FDCB6E", // bg-[#FDCB6E] ring-[#FDCB6E] Mustard Yellow
"#6C5CE7", // bg-[#6C5CE7] ring-[#6C5CE7] Soft Purple
"#FF85A2", // bg-[#FF85A2] ring-[#FF85A2] Pink
"#2ECC71", // bg-[#2ECC71] ring-[#2ECC71] Emerald Green
"#E17055", // bg-[#E17055] ring-[#E17055] Terracotta

EMOJI LIST

{ emoji: "💰", label: "Money (Sale)" },
{ emoji: "👤", label: "User (Sign-up)" },
{ emoji: "🎉", label: "Celebration" },
{ emoji: "📅", label: "Calendar" },
{ emoji: "🚀", label: "Launch" },
{ emoji: "📢", label: "Announcement" },
{ emoji: "🎓", label: "Graduation" },
{ emoji: "🏆", label: "Achievement" },
{ emoji: "💡", label: "Idea" },
{ emoji: "🔔", label: "Notification" },

DASHBOARD CODE SNIPPET

`await fetch('https://pingpanda.io/api/events', {
  method: 'POST',
  headers: {
    'Authorization': 'Bearer YOUR_API_KEY'
  },
  body: JSON.stringify({
    category: '${categoryName}',
    fields: {
      field1: 'value1', // for example: user id
      field2: 'value2' // for example: user email
    }
  })
})`