HN

Comments (16)

• paulirish
  I love playful interaction too, but you can get all this for free: SVGs are natively interactive.Here's your demo in 45 lines of SVG and CSS: https://codepen.io/paulirish/pen/gbOZXJp
• yomielu
  Awesome work! Not sure if this is intentional but it looks like the (lack of) contrast on the text vs background color is making it hard to read anything on the landing page.
• Menu

  simlevesque
  This example doesn't seem to work, I hover it and nothing happens, in incognito, chrome latest: https://svggles.vercel.app/?tab=Documentation%2FHover%2FAnim...
• khaki54
  Did you consider using lottie and its interactivity? What were the tradeoffs?
• anon
  undefined
• hersko
  Your landing page made my 9 year old laugh. Good work!
• Menu

  ckemere
  Doesn't seem to do anything in firefox either.
• abdulyki
  Looks cool but isn't this just using gsap and having a wrapper around it?
• Menu

  1ilit
  looks cool, you should probably gitignore some of the dirs there though
• westurner
  MDN docs > SVG and CSS: https://developer.mozilla.org/en-US/docs/Web/SVG/Tutorials/S...
• westurner
  Src: https://github.com/shantinghou/interactive-illustrations
• Menu

  recursive
  It seems unusual to make the package name so different from the project name.Also, the instructions for converting svg to react component work sometimes. It won't work if your svg has any style attributes for example. React also warns on some valid svg attributes, such as this one. <rect x="11" y="11" width="8" height="8" stroke="green" clip-path="circle() view-box" /> I've spent at least a day cleaning up after devs who just dropped inline SVG content into react components without checking whether it works. If you actually had a reliable way of embedding SVG in JSX in such a way that it worked with react, I might have use for it on occasion.The given code example is missing a right angle brace on the `<svg` line.