db.json

{
  "posts":
  [   
    {
      "heading": "Variable Fonts animation",
      "caption": "Work life balance Variable Fonts animation",
      "codepenhash" : "JjJrzvo"
    }, 
    {
      "heading": "Text Animation",
      "caption": "Text fade-in animation for your portfolio",
      "codepenhash" : "JjJjxmW"
    },  
    {
      "heading": "Radio button",
      "caption": "Interactive Radio Button Animation  Using CSS",
      "codepenhash" : "vYxGjYz"
    }, 
    {
      "heading": "Speech bubble",
      "caption": "Animated speech bubble using pure css",
      "codepenhash" : "zYZrVbz"
    }, 
    {
      "heading": "tab menu",
      "caption": "Sliding tab menu ui using pure css ",
      "codepenhash" : "dyvGNrq"
    },  
     {
      "heading": "Image hover effect",
      "caption": "Stylish text rotate on image hover effect using pure css",
      "codepenhash" : "BaWoPyM"
    },
     {
      "heading": "Timeline",
      "caption": "Responsive timeline using HTML & CSS ",
      "codepenhash" : "ZEeGwVQ"
    }, 
    {
      "heading": "Coin tossing animation",
      "caption": "Send me tip button with cooool coin tossing animation ",
      "codepenhash" : "vYxOmwz"
    }, 
    {
      "heading": "Neumorphism buttons",
      "caption": "Nurmorphism social share button using css",
      "codepenhash" : "ExWjZmQ"
    }, 
  
    {
      "heading": "floating card",
      "caption": "Floating and perspective card using pure css",
      "codepenhash" : "dyvovzo"
    }, 
    {
      "heading": "clock loader",
      "caption": "clock loading animation using pure css",
      "codepenhash" : "poeJerK"
    }, 
    {
      "heading": "Pinterest card",
      "caption": "Pinterest card on hover effect using css",
      "codepenhash" : "jOBPBGx"
    }, 
    {
      "heading": "pop out slider",
      "caption": "Pop out slider for your hero section using HTML, CSS, Javascript",
      "codepenhash" : "jOBPBax"
    }, 
    {
      "heading": "crazy button",
      "caption": "Attantion grabing button using pure css this makes your website standout",
      "codepenhash" : "PopqpEm"
    },  
  {
    "heading": "nurmorphic button",
    "caption": "Neumorphic radio button using pure css (can be used in quiz app)",
    "codepenhash" : "oNZXZEj"
  },
  {
    "heading": "gooey loder",
    "caption": "Gooey spinning loading animation using pure css",
    "codepenhash" : "RwpPpPW"
  },
  {
    "heading": "Bouncing ball loading animation",
    "caption": "Boncing balls loading animation using pure CSS",
    "codepenhash" : "rNyVLvJ"
  },
  {
    "heading": "darkmode toggle",
    "caption": "Animated darkmode toggle with icons using HTML CSS Javascript",
    "codepenhash" : "KKWpMQW"
  },
  {
      "heading": "scroll indicator",
      "caption": "Mouse scroll down indecator using pure css",
      "codepenhash" : "eYvNzGG"
    },
    {
      "heading": "Vertical iconbar ",
      "caption": "Vertical iconbar with cooo..l on hover animation on icons for mordern websites",
      "codepenhash" : "oNBOqjw"
      
    },
    {
      "heading": "responsive and animated navbar using html css & javascript. ",
      "caption": "Responsive and animated navbar which includes lits of animations like underline on hover slow reveling and many more with amazing UI.",
      "codepenhash" : "wvgZmGQ"
    },
    {
      "heading": "Clock loading animation using sass",
      "caption": "cooo..l Clock loading animation using sass 🕖",
      "codepenhash" : "LYxvdbL"
    },
    {
      "heading": "SEARCH BOX ANIMATION USING PURE CSS 🔎",
      "caption":
      "Cooooo...l search box animation using pure css this is click to expand animation 🔍",
      "codepenhash" : "XWpQERK"
    },
    {
        "heading": "Sliding perspective animimation",
        "caption": "Coooo...l Sliding perspective animation using css which slides on hover",
      "codepenhash" : "zYNXWzo"
    },
    {
      "heading": "Text color changing animation",
      "caption": "Amazing text color changing animation using few lines of CSS I got this idea by seeing few GITHUB websites ",
      "codepenhash" : "wvgZmrO"
    },
    {
      "heading": "AMAZING LOADING ANIMATION USING PURE CSS 😍",
      "caption":
        "Amazing code building loading animation with including shaking animation",
      "codepenhash" : "yLgrKpY"
    },
    {
      "heading": "Modern hamburger menu animation using html css and javascript ",
      "caption":
      "Are you bored by seeing and using the hamburger menu from long before ? Hear the modern hamburger menu icon with amazing Animation.",
      "codepenhash" : "poRBLKj"
    },
    {
      "heading": "neumorphism social media buttons",
      "caption": "Neumorphism social media buttons using html & css with with cool appearing animation ",
      "codepenhash" : "GRrLxwz"
    },
    {
      "heading": "GLASSMORPHISM PROFILE CARD & GLASSMORPHISH EFFECT USING ONLY FEW LINES OF CSS",
      "caption":
        "Simple and best Glassmorphism profile card including how to make that glass effect using only few lines of css 🍳✨",
        "codepenhash" : "XWpQEGg"
    },
    {
      "heading": "sweet alert",
      "caption": "Sweet alert using javascript",
      "codepenhash" : "gOgyzbN"
    },
    {
     
      "heading": "share on social button",
      "caption": "share on social media button with nice on hover animation using pure css.",
      "codepenhash" : "PoWgeqM"
    },
    {
      
      "heading": "Typing animation|",
      "caption": "Typing animation using only few lines of javascript code. This is my first post 😜",
      "codepenhash" : "jOyRxWM"
    }
  ]
}