Partner assets: badge, logo and icon

Built a site with Croftweaver, or writing about it? Here are the badge, the logo and the icon to download, and the code to paste the badge into your footer.

You do not have to credit Croftweaver. A credit is a request, never a condition of using it. If you do add the badge, a link back to this page helps the next person find Croftweaver. More on crediting.

New here? A badge like this on another site means it was built with Croftweaver, a set of skills that lets an AI coding assistant build and test a website. The home page explains how.

The Built with Croftweaver badge

The badge says in three words that a site was built with Croftweaver. It comes in two sizes and two looks: light for a light page, dark for a dark one. Use the SVG where you can, because it stays sharp at every size and is small. The PNG is for places where SVG does not work, such as an email.

Light

For a light page. 179 by 32 px.

Dark

For a dark page. 179 by 32 px.

Small, light

For a tight footer, on a light page. 156 by 24 px.

Small, dark

For a tight footer, on a dark page. 156 by 24 px.

Put the badge in your footer

Two steps. First save the badge files you want in the public/brand/badge/ folder of your own site: the files are in the section above. Then paste one of these into your footer. Your site then serves the badge itself, so no visitor's browser contacts another site. That also keeps the security rules of a Croftweaver site as they are: they allow images from the site itself and from no other site, so an image served from croftweaver.com would be blocked.

The HTML versions already have what the Croftweaver checks ask of an image: a description, a size and a loading setting. Each one links back to this page.

Follows light and dark

The badge changes with the visitor's own setting. A good choice if you are not sure. Needs the files built-with-croftweaver-light.svg and built-with-croftweaver-dark.svg.

<a href="https://croftweaver.com/partner-assets?ref=badge" title="Built with Croftweaver">
  <picture>
    <source srcset="/brand/badge/built-with-croftweaver-dark.svg"
            media="(prefers-color-scheme: dark)">
    <img src="/brand/badge/built-with-croftweaver-light.svg"
         alt="Built with Croftweaver"
         width="179" height="32"
         loading="lazy" decoding="async">
  </picture>
</a>

Light badge

For a page with a light background. Needs the file built-with-croftweaver-light.svg.

<a href="https://croftweaver.com/partner-assets?ref=badge" title="Built with Croftweaver">
  <img src="/brand/badge/built-with-croftweaver-light.svg"
       alt="Built with Croftweaver"
       width="179" height="32"
       loading="lazy" decoding="async">
</a>

Dark badge

For a page with a dark background. Needs the file built-with-croftweaver-dark.svg.

<a href="https://croftweaver.com/partner-assets?ref=badge" title="Built with Croftweaver">
  <img src="/brand/badge/built-with-croftweaver-dark.svg"
       alt="Built with Croftweaver"
       width="179" height="32"
       loading="lazy" decoding="async">
</a>

Small badge

Swap light for dark in the file name to get the dark one. Needs the file built-with-croftweaver-small-light.svg.

<a href="https://croftweaver.com/partner-assets?ref=badge" title="Built with Croftweaver">
  <img src="/brand/badge/built-with-croftweaver-small-light.svg"
       alt="Built with Croftweaver"
       width="156" height="24"
       loading="lazy" decoding="async">
</a>

Markdown

For a README, or any page that may show an image from another site. It links to the file on this site. Where images must come from your own site, save the file and use the HTML above.

[![Built with Croftweaver](https://croftweaver.com/brand/badge/built-with-croftweaver-light.svg)](https://croftweaver.com/partner-assets?ref=badge)

Text only

If a badge does not suit your design.

Built with <a href="https://croftweaver.com/partner-assets?ref=badge">Croftweaver</a>

Logo and icon

The logo is the mark with the name beside it. The icon is the mark alone. Both come as SVG and as PNG with a transparent background. Prefer the SVG. Choose the colour by the background it will sit on.

In the file names of the logo and the icon, light and dark describe the ink, not the page: light ink is for dark backgrounds. The badges are the other way round: the light badge is for a light page.

Logo

Dark ink

For light backgrounds.

Moss

For light backgrounds only.

Light ink

For dark backgrounds.

Icon

Dark ink

For light backgrounds.

Moss

For light backgrounds only.

Light ink

For dark backgrounds.

The colours

Dark ink #1a1f1b: For light backgrounds.
Moss #2e6e4e: For light backgrounds only.
Light ink #e3e8e1: For dark backgrounds.

Using the kit

We ask you to follow these, so that the logo and the badge stay recognisable.

Use the badge only on a site that was built with Croftweaver.
Write the name as Croftweaver: a capital C, one word.
Leave clear space around the mark and the logo: a quarter of the mark's height on every side.
Keep the files at least this size: icon 16 px, logo 20 px tall, badge 32 px tall (24 px for the small badge).
Use the logo and the icon in one colour only, and the badge as it is. Do not recolour, stretch, rotate or outline any of them, add effects, or rearrange them.
Keep the alt text, the written description of the image: Croftweaver for the logo, Built with Croftweaver for the badge.

Crediting Croftweaver

Croftweaver is free and MIT-licensed. The licence asks one thing of you: keep its copyright and licence notice, the text in the LICENSE file of its repository, with any copy or substantial part of Croftweaver. Seven of its skills are derived from another MIT-licensed project, and their notice, in THIRD-PARTY-LICENSES.md, goes with them. The licence does not ask you to credit Croftweaver on the sites you build, and we do not make a credit a condition. This is a short summary: the licence files are the text that counts.

We would still be glad of one. If your site was built with Croftweaver, the badge in your footer, linking back to this page, helps the next person find it. If a badge does not suit your design, a plain text link works too.

This is a request, not a rule. Leaving the badge out breaks no term of the Croftweaver licence.