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

# Anvil Insights - March 2025

export const BlogMeta = ({date, author, tags}) => {
  const formatList = items => {
    if (!Array.isArray(items)) return items;
    if (items.length === 1) return items[0];
    if (items.length === 2) return `${items[0]} & ${items[1]}`;
    return `${items.slice(0, -1).join(", ")}, & ${items[items.length - 1]}`;
  };
  return <div className="flex flex-wrap items-center gap-2 text-sm text-gray-500 dark:text-gray-400">
      <span>{date}</span>
      <span>|</span>
      <span>{formatList(author)}</span>
      {tags && tags.length > 0 && <>
          <span>|</span>
          <div className="flex flex-wrap gap-1.5">
            {tags.map(tag => <span key={tag} className="px-2 py-1 rounded bg-gray-100 dark:bg-neutral-800 text-xs">
                {tag}
              </span>)}
          </div>
        </>}
    </div>;
};

<BlogMeta date="March 27, 2025" author="Jess Paris" tags={["Newsletter"]} />

Anvil Insights Anvil Design System | March 2025

### View on the web

**Anvil Design System | March 2025**

This Newsletter is best viewed on the [web](https://us12.campaign-archive.com/?e=__test_email__\&u=9204daf008d5c0375b6495402\&id=8bea56ece9).

### Anvil's Mission

Anvil Design System empowers teams to build accessible, scalable, and delightful user experiences for ServiceTitan.

We aim to develop assets and systems rooted in key design and engineering processes, partnerships, and modern systems thinking. We inspire through collaboration, while allowing our consumers to do more with less.

### Fast Facts

* 93% of net new projects are using Anvil2, learn more [here](https://servicetitan.atlassian.net/wiki/spaces/ADS/pages/3246981127/Anvil2+FAQ#When-should-I-use-Anvil2-in-my-Product%3F)
* Figma adoption increase of 31.23% over H2
* A2 code adoption 27x’ed over H2
* Check out our [Impact Tracker](https://docs.google.com/spreadsheets/d/1w_KohVlAEq7FwWL3dklHk1WQbPhtFXXueIELjJaykYw/edit?usp=sharing) to see how we calculate this

### Highlight: FY25 in Review

As we wrap up another exciting year for Anvil Design System, we want to take a moment to celebrate what we’ve accomplished and share what’s coming next. Our goal has always been to make building with Anvil more efficient, accessible, and consistent—and this past H2 was no exception. Let’s dive into the highlights and what you can expect in Q1.

<table>
  <tbody>
    <tr>
      <td>
        <h4>🚀 Launched Several New Components and Patterns</h4>

        <ul>
          <li>Breadcrumbs</li>
          <li>Edit Card (A1’s Flow Card)</li>
          <li>Chatbot UI</li>
          <li>Search Field Component</li>
          <li>Search Results pattern</li>
          <li>Segmented Control</li>
          <li>Skeleton</li>
          <li>Toast</li>
        </ul>

        <h4>📊 Impact Tracker Dashboard Launched</h4>

        <p>
          We now have a{" "}

          <a href="https://docs.google.com/spreadsheets/d/1w_KohVlAEq7FwWL3dklHk1WQbPhtFXXueIELjJaykYw/edit?usp=sharing">
            living dashboard
          </a>

          {" "}

          to track Anvil, Visual Design, and DesignOps impact—helping measure
          efficiency, adoption, and consistency across ServiceTitan. Check out
          the Anvil ROI calculator to see what migrating to Anvil could mean for
          your team.
        </p>

        <h4>🚀 Powering Major Product Areas</h4>

        <p>
          Anvil2 is now driving multiple product areas, including PLG
          Marketplace, Knowledge Base, Help Center, Dispatch Pro Console, Global
          Search, and Global Navigation.
        </p>

        <h4>🎨 Figma & Adoption Improvements</h4>

        <p>
          We built a{" "}

          <a href="https://servicetitan.atlassian.net/wiki/spaces/ADS/pages/3074458444/A2+Figma+Adoption+Dashboard">
            Figma adoption tracking strategy
          </a>

          {" "}

          to help consumers transition to A2 faster. This helped us hit our 55%
          adoption goal in Q4!
        </p>

        <h4>🔍 Fullstory Enhancements</h4>

        <p>
          We redesigned the{" "}

          <a href="https://anvil.servicetitan.com/docs/about-anvil2#using-a2-with-fullstory">
            Fullstory tagging solution
          </a>

          {" "}

          for better performance, including an opt-out option. All interactive
          Anvil2 components now generate a consistent data-tracking ID based on
          relevant props.
        </p>
      </td>

      <td>
        <h4>✅ Content System Live!</h4>

        <p>
          We’ve officially published{" "}

          <a href="/docs/web/content/actionable-language">
            content guidelines
          </a>

          {" "}

          on Anvil, thanks to Ani Tribunyan and Ashot Gyulzatyan! With legal
          reviews and refinements, this ensures clear, consistent content. Plus,
          we introduced Hermes GPT guidance to help teams create on-brand
          content. More updates coming soon!
        </p>

        <h4>📱 Mobile Web View (MWV) Support</h4>

        <p>
          Anvil2 components are at the core of MWV, providing key building
          blocks and we are currently providing 3rd-tier tokens for easier
          integration.
        </p>

        <h4>📢 Stronger Communication & Community</h4>

        <p>
          We rolled out an Outward Communication strategy to boost A2 adoption
          and education. This included:
        </p>

        <p>🔹 8+ announcements (excluding releases)</p>

        <p>
          🔹 4 <a href="/blog">blog posts</a>
        </p>

        <p>
          🔹 2{" "}

          <a href="https://docs.google.com/spreadsheets/d/1ebXmYWVHlnDenxVVfp1B837XlijIUF9Ej3zlMT7qvt8/edit?usp=sharing">
            Tech Talks
          </a>
        </p>

        <p>
          🔹 A{" "}

          <a href="https://servicetitan.zoom.us/rec/share/2c5kBoBfrtSSSTjd835xhh5-guaLb-tgyIGbB3mon6VY8fFUWw_BysoNHxpEZBCH.1WDUieUd-gZmsxm-?startTime=1722528121000">
            demo
          </a>

          {" "}

          at R\&D All Hands
        </p>

        <h4>🛠 Feature Board & Office Hours</h4>

        <p>
          We launched a self-service{" "}

          <a href="https://servicetitan.enterprise.slack.com/lists/T08QRUZ6W/F07EUDU0WS1">
            Feature Board
          </a>

          {" "}

          where teams can submit and upvote requests—58+ and counting! Our
          weekly reviews prioritize votes, impact and scalability.
        </p>

        <p>
          We also introduced dedicated Office Hours to unblock teams and cut
          extra meetings. Anvil now hosts 4 sessions/week—book yours directly
          from{" "}

          <a href="https://calendly.com/anvil-servicetitan/office-hours">
            Slack
          </a>

          !
        </p>

        <h4>⚡ Codemods Launched!</h4>

        <p>
          With codemods, consumers can automate 60% of Anvil to Anvil2
          migrations, making large-scale code changes faster and smoother with
          less manual effort.
        </p>
      </td>
    </tr>
  </tbody>
</table>

### What’s Coming Up

<img
  src="https://mintcdn.com/servicetitan/3mYpUmLYXzqe3A_Z/images/blog/anvil-insights/whats-coming-up-for-anvil.png?fit=max&auto=format&n=3mYpUmLYXzqe3A_Z&q=85&s=aecb330f03b6ba0cfbd2b9cad6c585cf"
  alt="What's Coming up for Anvil"
  style={{
display: "block",
marginLeft: "auto",
marginRight: "auto",
}}
  width="300"
  height="248"
  data-path="images/blog/anvil-insights/whats-coming-up-for-anvil.png"
/>

#### New Components and Patterns

* Agentic UX Framework and foundational path forward for AI & Anvil
* Peek (aka Hover Card)
* Select Card (A1’s Togglebox)
* Page Header within A2 Page
* Toolbar
* Drag and Drop
* Popover/Tooltip/Menu refactor
* Filters
* Combobox features: Add new, group options, select all
* Goal of 95% parity between A1 and A2 libraries by e/o Q2
* Secondary, danger secondary, and disabled buttons getting visual updates

#### Supporting Adoption

* Continue expanding Content System
* Conduct Anvil Adoption Clinics (PM, EM, FE)
* Develop Contribution Models POC for Engineering and Design
* Enhance Adoption Metrics Dashboard
* Offer additional Codemods
* 3rd-tier tokens

### Visual Design Updates

<img
  src="https://mintcdn.com/servicetitan/3mYpUmLYXzqe3A_Z/images/blog/anvil-insights/visual-design-updates.png?fit=max&auto=format&n=3mYpUmLYXzqe3A_Z&q=85&s=fc49780144b35853606800943f27d043"
  alt="Visual Design Updates"
  style={{
display: "block",
marginLeft: "auto",
marginRight: "auto",
}}
  width="300"
  height="214"
  data-path="images/blog/anvil-insights/visual-design-updates.png"
/>

<table>
  <tbody>
    <tr>
      <td>
        <h4>Illustration</h4>

        <ul>
          <li>Debuted new illustration style</li>

          <li>
            <a href="https://www.figma.com/design/9AdQ0X9Wgx54HHFPM1xkOT/%E2%9C%A8NEW%E2%9C%A8-Illustration-Library?m=auto&node-id=0-1&t=h763cOBVY02A55eT-1">
              Delivered Illustration library
            </a>

            {" "}

            w/ Figma component
          </li>

          <li>
            Delivered{" "}

            <a href="https://www.figma.com/design/9AdQ0X9Wgx54HHFPM1xkOT/%E2%9C%A8NEW%E2%9C%A8-Illustration-Library?m=auto&node-id=2064-738&t=h763cOBVY02A55eT-1">
              illustration guidance
            </a>

            {" "}

            and{" "}

            <a href="https://www.figma.com/design/9AdQ0X9Wgx54HHFPM1xkOT/%E2%9C%A8NEW%E2%9C%A8-Illustration-Library?m=auto&node-id=171-397&t=h763cOBVY02A55eT-1">
              usage document
            </a>

            {" "}

            for empty states
          </li>

          <li>20 Illustrations for Pendo delivered</li>
        </ul>

        <h4>Chatbot</h4>

        <ul>
          <li>
            Helped shape the visual direction of the{" "}

            <a href="https://www.figma.com/design/KfMPM2hzHLX6Sr1YGWNXHc/Anvil2?node-id=13445-438&node-type=canvas&t=qS5Z7QHtGCXAt0Z8-11">
              chatbot
            </a>
          </li>
        </ul>

        <h4>Color Standards</h4>

        <ul>
          <li>
            Guidance released on{" "}

            <a href="https://www.figma.com/design/8s6IZDIKqWN4Er9Mw6OFVz/Color-Blueprint?node-id=1-2&t=8SDyxHkcTJJyLoQc-1">
              color standards
            </a>
          </li>
        </ul>

        <h4>DTE</h4>

        <ul>
          <li>
            Delivered three custom DTE templates: invoice, roofing, service
            agreements
          </li>
        </ul>
      </td>

      <td>
        <h4>Northstar Visioning</h4>

        <ul>
          <li>
            Anvil component visual update to card & page header to be more
            inline with North Star visioning
          </li>
        </ul>

        <h4>Iconography</h4>

        <ul>
          <li>
            <a href="https://www.figma.com/design/x7uSPq1n1iZ3UZMjj5Z9DV/Icon-Standardization?node-id=1-2&t=LUxTxAyjISSq4lkc-1">
              58 icons standardized
            </a>

            {" "}

            in FY25
          </li>
        </ul>

        <h4>AI</h4>

        <ul>
          <li>
            Regular utilization of AI in our workflows from vector creations to
            image generation for templates
          </li>

          <li>Agentic Northstar Desktop UI direction delivered</li>
        </ul>

        <h4>Pendo</h4>

        <ul>
          <li>
            <a href="https://www.figma.com/design/qNvnc7BtuEjSbLFlC6YrSD/Design-Change-Management?m=auto&node-id=39-32115&t=TmY7aCtcRNPmKaxF-1">
              Visual design of the Pendo modals
            </a>

            {" "}

            updated for A2
          </li>
        </ul>
      </td>
    </tr>
  </tbody>
</table>

### Want to Learn More?

* [Watch](https://servicetitan.slack.com/archives/C02CT71F6H5/p1738951335439309) our Tech Talk on Codemods, Anvil2 gotchas, and more
* [Watch](https://servicetitan.zoom.us/rec/share/2c5kBoBfrtSSSTjd835xhh5-guaLb-tgyIGbB3mon6VY8fFUWw_BysoNHxpEZBCH.1WDUieUd-gZmsxm-?startTime=1722528121000) R\&D Demo

### Quick Links

* [Anvil Roadmap](https://servicetitan.atlassian.net/wiki/spaces/ADS/pages/3542679587/FY26+Roadmap)
* [Anvil 2 Strategy](https://servicetitan.atlassian.net/wiki/spaces/ADS/pages/2735178212/Anvil+2+-+Standardization)
* [Anvil2 Docs Site](http://anvil.servicetitan.com/)
* [#ask-designsystem](https://servicetitan.enterprise.slack.com/archives/CBSRGHTRS)
* [Add to our Feature Board](https://servicetitan.enterprise.slack.com/lists/T08QRUZ6W/F07EUDU0WS1)
* [Impact Tracker: Design System, Visual Design, and DesignOps](https://docs.google.com/spreadsheets/d/1w_KohVlAEq7FwWL3dklHk1WQbPhtFXXueIELjJaykYw/edit?usp=sharing)
* [Report a bug](https://servicetitan.atlassian.net/secure/CreateIssue.jspa?issuetype=1\&pid=11329)