> For the complete documentation index, see [llms.txt](https://docs.cryptofonts.com/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.cryptofonts.com/webfonts/quickstart-guide.md). # Quickstart guide If you are looking to try out Cryptofonts you can use our CDN instead of hosting it yourself. Simply add the current one-liner at the `head` of your document to use the latest version. ```html ``` If you find yourself stuck, or it’s the first time using a Webfont, you can download our quickstart template to see how it works. {% embed url="" %} If you want to use a previous version of Cryptofonts visit this section for more information. [Previous versions](/webfonts/previous-versions.md) *** ## Npm install Cryptofonts is also available as an npm package. To install run the following command from within your project. ``` npm i @cryptofonts/cryptofont ``` *** ## Manual install If you decide to manually install Cryptofonts and host it on your website, download the latest release of Cryptofonts from GitHub to get started. [Download the latest release from GitHub](https://github.com/monzanifabio/cryptofont/releases) ### **1. Move the CSS and web fonts into your project.** Copy the entire \*\*`webfonts`\*\*folder and the \*\*`cryptofont.css`\*\*into your project’s static assets directory (or where ever you prefer to keep front end assets or vendor stuff). ### **2. Reference the CSS** Add a reference to the \*\*`cryptofont.css`\*\*styling file into the ``of each template or page that you want to use Crypto Font on. Pay attention to the pathing of your project and where you moved the files to in the previous step. ```html ``` ### **3. Place icons in your UI’s markup** With the references complete, you can now start placing icons in your HTML’s `` We recommend using a consistent HTML element, like an `` You can place Crypto Fonts icons just about anywhere using the CSS Prefix `cf` and the crypto ticker. ```html ``` --- # Agent Instructions This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com. ## Querying This Documentation If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question. Perform an HTTP GET request on the current page URL with the `ask` query parameter, and the optional `goal` query parameter: ``` GET https://docs.cryptofonts.com/webfonts/quickstart-guide.md?ask=&goal= ``` `ask` is the immediate question: it should be specific, self-contained, and written in natural language. `goal` is optional and describes the broader end goal you are ultimately trying to accomplish on behalf of the user. GitBook uses it to tailor the answer towards what is most useful for that goal. The response will contain a direct answer to the question and relevant excerpts and sources from the documentation. Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.