> ## Documentation Index
> Fetch the complete documentation index at: https://docs.tomake.design/llms.txt
> Use this file to discover all available pages before exploring further.

# Welcome to Tomake Design

> Convert websites and PDFs into fully editable Figma designs

Transform any website or PDF into editable Figma designs with our powerful Figma plugins. No design skills required.

## Our products

<CardGroup cols={2}>
  <Card title="html.tomake.design" icon="chromium" href="/html-to-design/what-is-html-to-design">
    Convert websites, HTML/CSS code, and AI-generated code into fully editable Figma designs. Multi-viewport support included.
  </Card>

  <Card title="pdf.tomake.design" icon="file-pdf" href="/pdf-to-design/what-is-pdf-to-design">
    Transform PDF files into editable Figma designs. **100% local processing** — your files never leave your computer.
  </Card>
</CardGroup>

## Get started quickly

<Tabs>
  <Tab title="html.tomake.design">
    ### Convert websites to Figma

    <Steps>
      <Step title="Install the plugin">
        Install [html.tomake.design](https://www.figma.com/community/plugin/1557932447766289380) from Figma Community
      </Step>

      <Step title="Enter a URL">
        Paste any website URL into the plugin
      </Step>

      <Step title="Configure & capture">
        Choose viewport size, theme, and click capture
      </Step>

      <Step title="Edit in Figma">
        Your website is now a fully editable Figma design
      </Step>
    </Steps>

    <Card title="Learn more about html.tomake.design" icon="arrow-right" href="/html-to-design/getting-started" horizontal>
      Complete getting started guide
    </Card>
  </Tab>

  <Tab title="pdf.tomake.design">
    ### Convert PDFs to Figma

    <Steps>
      <Step title="Install the plugin">
        Install [pdf.tomake.design](https://www.figma.com/community/plugin/1556109033323159906) from Figma Community
      </Step>

      <Step title="Upload a PDF">
        Choose any PDF file from your computer
      </Step>

      <Step title="Configure import">
        Select pages, resolution, and text handling options
      </Step>

      <Step title="Edit in Figma">
        Your PDF is now a fully editable Figma design
      </Step>
    </Steps>

    <Card title="Learn more about pdf.tomake.design" icon="arrow-right" href="/pdf-to-design/getting-started" horizontal>
      Complete getting started guide
    </Card>
  </Tab>
</Tabs>

## Why choose Tomake Design?

<CardGroup cols={3}>
  <Card title="Save time" icon="clock">
    Convert websites and PDFs to Figma in minutes instead of hours of manual recreation.
  </Card>

  <Card title="Fully editable" icon="pen-to-square">
    All elements are editable in Figma — text, images, colors, and layouts.
  </Card>

  <Card title="No skills needed" icon="wand-magic-sparkles">
    Anyone can use our plugins, regardless of design experience.
  </Card>

  <Card title="High fidelity" icon="eye">
    Pixel-perfect conversions that preserve layouts, typography, and visual elements.
  </Card>

  <Card title="Team collaboration" icon="users">
    Share converted designs with your team in Figma for seamless collaboration.
  </Card>

  <Card title="Extract assets" icon="images">
    Pull images, graphics, and design elements for use in your projects.
  </Card>
</CardGroup>

## Popular use cases

<AccordionGroup>
  <Accordion title="Competitive analysis" icon="chart-line">
    Study competitor websites and marketing materials in detail. Convert their sites to Figma to analyze layouts, components, and design patterns.
  </Accordion>

  <Accordion title="Design inspiration" icon="lightbulb">
    Convert websites you admire into Figma to understand their design systems, spacing, and component structures.
  </Accordion>

  <Accordion title="Redesign projects" icon="paintbrush">
    Start redesign projects with the current website or PDF as your Figma template. Make iterations and present variations to stakeholders.
  </Accordion>

  <Accordion title="Client presentations" icon="presentation">
    Convert client PDFs or existing websites to Figma to present improvements, variations, and new design directions.
  </Accordion>

  <Accordion title="Asset extraction" icon="download">
    Extract images, icons, logos, and design elements from websites and PDFs for use in your own projects.
  </Accordion>

  <Accordion title="Design handoff" icon="hand-holding">
    Transform PDF mockups into Figma files for easier developer handoff with proper specs and assets.
  </Accordion>
</AccordionGroup>

## Explore our documentation

### html.tomake.design

<CardGroup cols={2}>
  <Card title="What is html.tomake.design?" icon="circle-question" href="/html-to-design/what-is-html-to-design">
    Learn about the website to Figma conversion plugin
  </Card>

  <Card title="Getting started" icon="rocket" href="/html-to-design/getting-started">
    Install and convert your first website
  </Card>

  <Card title="How it works" icon="gears" href="/html-to-design/how-it-works">
    Understand the conversion process
  </Card>

  <Card title="Troubleshooting" icon="wrench" href="/html-to-design/troubleshooting">
    Fix common issues
  </Card>
</CardGroup>

### pdf.tomake.design

<CardGroup cols={2}>
  <Card title="What is pdf.tomake.design?" icon="circle-question" href="/pdf-to-design/what-is-pdf-to-design">
    Learn about the PDF to Figma conversion plugin
  </Card>

  <Card title="Getting started" icon="rocket" href="/pdf-to-design/getting-started">
    Install and convert your first PDF
  </Card>

  <Card title="How it works" icon="gears" href="/pdf-to-design/how-it-works">
    Understand the conversion process
  </Card>

  <Card title="Troubleshooting" icon="wrench" href="/pdf-to-design/troubleshooting">
    Fix common issues
  </Card>
</CardGroup>

## Get help and support

<CardGroup cols={3}>
  <Card title="Discord community" icon="discord" href="https://discord.com/invite/VVArNqBGjB">
    Join our community for help, tips, and discussions
  </Card>

  <Card title="Email support" icon="envelope" href="mailto:support@tomake.design">
    Contact our support team directly
  </Card>

  <Card title="Follow on Twitter" icon="x-twitter" href="https://x.com/tomakedesign">
    Stay updated with news and tips
  </Card>
</CardGroup>

<Note>
  Both plugins include free conversions each month. Start converting today — no credit card required.
</Note>