Show HN: Figma-use – CLI to control Figma for AI agents

 (github.com)

54 points | by dannote 11 hours ago

11 comments

  • GenerWork 16 minutes ago
    As a product designer, this looks really interesting! I'm curious if you've experimented throwing caution to the wind and asking it to make an entire design system (colors, text, components), and if so, how well it's worked.
  • kordlessagain 9 minutes ago
    > MCP servers exchange verbose JSON. CLIs are token-efficient

    Extra chars from JSON are the least of our problems with MCP.

  • Asciilotle 47 minutes ago
    Nice use case! I built something along similar lines.. an ASCII wireframe generator to jump straight from idea to code with zero friction: https://bareminimum.design/. Also handy for quick UI critiques. Curious what you think.
    [-]
    • dougfulop 42 minutes ago
      Wish there were examples without a signup
  • pglevy 2 hours ago
    I'm curious to understand more about your use case. I've been working on getting fellow designers out of Figma since it's easier to express intent in code now using LLMs.
    [-]
    • dannote 1 hour ago
      I still have a lot of assets living in Figma, and for some things it’s simply faster to prototype there before moving to code.

      Personally, I’d really like to automate part of the workflow around exporting from Figma and assembling a design system into components — right now there’s just too much manual work involved.

    • james_marks 1 hour ago
      Not OP, but my interest in Figma is that when a human designer needs to take over, UI/UX designers know Figma.
      [-]
  • VladVladikoff 4 hours ago
    Can it make a SVG of a pelican riding a bicycle?
    [-]
    • dannote 8 minutes ago
      Will add vector path manipulation soon!
    • rafaelmn 4 hours ago
      "Humanity's last exam" HN edition
      [-]
      • Mic92 2 hours ago
        I am a human and I can't...
        [-]
        • bryanrasmussen 1 hour ago
          looks like you failed your last exam, please exit through the red door down the aisle.
  • falloutx 4 hours ago
    I like how MCP is not shoved into our face anymore after people realised more mcp servers eat into context and agents can easily use CLI tools.
    [-]
    • kordlessagain 8 minutes ago
      And how do the agents use the CLI tools, exactly?
    • _pdp_ 4 hours ago
      I fully agree with the comment but CLI tools don't do auth and session management in a consistent way. Besides, imagine if now every vendor out there need to distributed custom binaries for their services. Some of them do. Many don't.. but overall it is just increased security risk for the end user when the functionality that is delivered is simply an interface to an API.
      [-]
      • Mic92 2 hours ago
        I remember that a llm agents often store those in clear text files (I think claude-code beeing one of them). Many of the CLIs I use have a better secret hygiene than that i.e. allow passwords commands or use secret apis.
      • conception 2 hours ago
        MCP tools do not do auth and session management in a consistent way based on just the seven or so I use regularly.
  • eddywebs 4 hours ago
    I can attest that ai agent executing cli binaries is better than use of an mcp, just because of the limitations of mcp, also figma mcp requires a pro license. Does the figma cli require a pro license as well ?
    [-]
    • dannote 1 hour ago
      I don’t think so. This CLI mostly relies on the plugin API, which is free.
  • james_marks 1 hour ago
    Nice work!

    How does it do applying styles from an existing codebase?

    We have style guides, strong base css, etc. If that was represented when it built in Figma, that could be interesting.

    [-]
    • dannote 54 minutes ago
      Thanks! Right now it doesn't parse CSS directly, but you can bind colors to Figma variables:

        figma-use variable create "brand/primary" --collection <id> --type COLOR --value "#3B82F6"
      Then reference them in JSX render:

        figma-use render ./Button.figma.tsx

  const colors = defineVars({
    primary: { name: 'brand/primary', value: '#3B82F6' },
  })

  export default () => (
    <Frame style={{ backgroundColor: colors.primary }}>
      <Text style={{ color: '#FFF' }}>Button</Text>
    </Frame>
  )
      So if you map your design tokens to Figma variables first, components will reference them. Parsing CSS/Tailwind configs automatically could be a good feature though.
  • preommr 2 hours ago
    Any thoughts on why Citty, or if there's any other cli tools you might recommend?
    [-]
  • findley_cheqs 1 hour ago
    [dead]
  • Manly_may 1 hour ago
    [dead]