• kevincox@lemmy.mlM
    link
    fedilink
    arrow-up
    11
    ·
    18 hours ago

    Why are these TypeScript + JSX rather than just SVGs? It seems that the paths are defined as SVG but they are using some JavaScript framework to define the animations rather than just using SVG or CSS animations.

    • atyaz [he/him]@hexbear.net
      link
      fedilink
      arrow-up
      2
      ·
      4 hours ago

      It’s jsx which is framework agnostic and used in several frameworks but most closely associated with react. It’s easy to convert to html but I guess the author is a react dev and also these icons use framer-motion which is a react animation library to animate the cursor hover. Looks like you can strip those out if you wanted to use these icons in html without animations.

      • kevincox@lemmy.mlM
        link
        fedilink
        arrow-up
        2
        ·
        3 hours ago

        is framework agnostic

        But it isn’t, because they depend on framer-motion and React. JSX is, but the icons aren’t.

        You can trivially provide on-hover animations using CSS in SVG then your icons are framework agnostic. Not to mention smaller to download and more efficient to execute.

    • SirQuackTheDuck@lemmy.world
      link
      fedilink
      arrow-up
      17
      ·
      edit-2
      17 hours ago

      Because they’re using events and downloading a few megabytes of extra javascript framework is, of course, a way better option than six lines of SVG stylesheets.

      Edit: forgot a /s

  • BananaTrifleViolin@lemmy.world
    link
    fedilink
    English
    arrow-up
    27
    ·
    1 day ago

    This is not open source? There is no license just a statement saying free to use for personal and commercial projects, but don’t redistribute or resell.

    This freeware at best but if you contribute to this project it’s not clear who owns the work.

  • HatchetHaro@lemmy.blahaj.zone
    link
    fedilink
    arrow-up
    11
    arrow-down
    4
    ·
    23 hours ago

    a lot of these are terrible, made by an animator who doesn’t understand design and just wants to make lines move for the heck of it.

    • Katherine@discuss.tchncs.de
      link
      fedilink
      arrow-up
      4
      ·
      17 hours ago

      Since you hold a strong opinion on the quality, can you give an example of an animated icon pack which keeps to good design standards?

    • Num10ck@lemmy.world
      link
      fedilink
      English
      arrow-up
      2
      ·
      18 hours ago

      i agree these arent wonderful but i also like the idea in general and wouldnt want amazing icons to steal attention from the actual app functions anyway

    • Urist@lemmy.ml
      link
      fedilink
      English
      arrow-up
      1
      ·
      17 hours ago

      They made me want to click each of them. So am I allowed to consider them nice, or is your “professional” opinion going to be the judgement of that?

        • Urist@lemmy.ml
          link
          fedilink
          English
          arrow-up
          1
          ·
          8 hours ago

          No, I am essentially asking why they suck if a common user, such as me, likes them. Seems they fulfilled their purpose?

          • HatchetHaro@lemmy.blahaj.zone
            link
            fedilink
            arrow-up
            2
            ·
            6 hours ago

            Then that is your opinion and you are entitled to it.

            I do not like them because the animations are arbitrary, with no proper theme and consistency to how they work and what they actually represent.

            • Urist@lemmy.ml
              link
              fedilink
              English
              arrow-up
              1
              ·
              5 hours ago

              I know I am. I am also entitled to challenge your notion of “this is terrible” that is not really constructive to

              I do not like them because the animations are arbitrary, with no proper theme and consistency to how they work and what they actually represent.

              This is actually informative.