# How to build custom code template

**URL:** <https://community.hubspot.com/t/how-to-build-custom-code-template/95726>\
**Category:** CMS Development\
**Tags:** design-manager\
**Created:** [December 9, 2023, 5:31pm UTC](https://community.hubspot.com/t/how-to-build-custom-code-template/95726 "2023-12-09T17:31:43Z")\
**Posts on this page:** 1\
**Showing post:** 3

<div class="post-metadata">

**Author:** ![Anton](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/anton/32/103167_2.png) [@Anton](https://community.hubspot.com/u/Anton)\
**Post date:** [December 12, 2023, 10:10pm UTC](https://community.hubspot.com/t/how-to-build-custom-code-template/95726/3 "2023-12-12T22:10:13Z")

</div>

Hi @MHussain8,

building a theme - especially with beautiful UI(it’s always up to your preferences) can take up an enourmous amount of time. There are companies that are working for several months/years upon one theme, always optimizing it to the newest standards and user-requirements.

Developing a custom theme can be a great but pricy invest since custom themes _can start_ from 4-5k(depending on the developer and requirements, timeline and briefings).

But this doesn’t mean that you can’t do it yourself. As @Jnix284 mentioned, HubSpot provides the “theme boilerplate” which gives you a good basis for a custom theme.

But if you really want to do everything by yourself here’s my streamlined approach of developing custom themes:

- get all requirements from the client
- let them approve those (double check to minimize the potential scope-creep)
- get all design assets(logo, colors, fonts, icons, everything you need for the design/UI … )
- create a design in Figma or Adobe XD (while designing think of repetative elements like headlines, cards, images, buttons… so you’ll have a consistent design-language while coding)
- get the approval on the design
- start with the bare minimum of a theme fields.json: colors, font settings, buttons, forms, spacings
- create a theme.css file with all those variables and dependend classes
- create custom modules like cards, button, headline-text combos… whatever you need to have in the theme
- drop the custom modules in the templates
- debug
- optimize
- debug
- get approval from client
- get paid

since you want to have it for yourself you can skip the many steps but I highly recommend you to start by designing the theme first since moving pixels is always easier and faster than moving code 🙂

If you want to save time and money - check out the theme marketplace. There are a ton of ready-to-use themes (free & paid) available. Once you’ve created a [child-theme](https://developers.hubspot.com/docs/cms/building-blocks/themes/child-themes) of a downloaded/purchased theme you can customize it to your needs.

hope this helps

best,

Anton

---

_[View the full topic](https://community.hubspot.com/t/how-to-build-custom-code-template/95726)._