Skip to content
Riccardo Marconato

Brand identity, website and CMS · 2026

Adamarant. My studio’s brand, website and CMS.

Adamarant is the studio where I design and build brands, websites, apps and AI agents. I designed its brand, the website in three languages and the CMS it runs on, with a drawing for every service and a cover for every article.

The home, the services and the agents, scrolled.

The brief

The site had to say what the studio does in one sentence, put the work right under it, and lead a visitor to a first call or a written estimate.

It also had to run on very little of my time: three languages, a blog that keeps growing, and every page edited in one CMS.

The Adamarant wordmark in white on black, nine capitals drawn with one thin line, over the line Design and engineering for brands, websites and software.
The wordmark, drawn with one line.

The brand

The wordmark is drawn with a single thin line, the same in every letter. Its first letter, the open A, stands alone as the mark: it is the app icon, and it takes the wordmark’s place in the bar on a phone.

The site is black and white. Amaranth, the colour in the name, marks the links that lead to more and the steps of the estimate. General Sans sets the titles and Satoshi the text.

Three panels: the open A in white on a black rounded tile, the open A in black on white, and the bar of the site on a phone with the A, a Start button and a menu.
The open A as the app icon, the mark and the bar on a phone.
Five colour columns: #0A0A0D for the dark page, #17171B for raised panels, #FAFAFA for the light page, #6F6F79 for words not yet read and #BE185D, amaranth, for links to more and the estimate’s steps.
Two blacks, a white, a grey and amaranth.
Type specimens: a large Aa and the alphabet in General Sans, a sentence in Satoshi, and the title Agents for the work that repeats on white.
General Sans for titles, Satoshi for text.

The website

Each band of the home says one thing: what the studio makes, the work, the services, how it builds, a few articles and the way to start. The only pictures on it are the work’s own.

Every page follows the reader’s settings into the dark or the light theme.

The Adamarant home in a browser window: the title From the first sketch to the thousandth customer, the line under it, a Start a project button, and the first case studies below.
The home.
Every section of the home on grey, in two columns: the bar and the title, four case studies, the five services as rows, the statement about how the studio builds, three articles, the light closing band and the footer.
Every section of the home.
Two browser windows with the same home, one in the dark theme and one in the light theme.
The home in the dark and the light theme.

The pages

The services stack as you scroll, one card over the last, each with its drawing. A service’s page opens on a paragraph that fills in as it is read, then lists what you get.

The About and the Agents pages are read one line at a time: the line crossing the middle of the screen is lit, and the others wait in grey.

Two browser windows: the services page with the Brands card and its drawing, and the Brands page with its list of what you get beside the same drawing.
The services, and what one of them includes.
Two browser windows: the About page with its statement in white and the list of what the studio makes, and the Agents page with six names, Atlas lit and the others in grey.
The About and the Agents, lit one line at a time.

The drawings

The site’s drawings are made with one kit: small tiles that are lit or off, and the lines between them. They are white on the dark page and black on the light one, and there are no words in them.

Each service has a drawing that moves, and every movement in it shows something the sentence beside it says.

Five drawings in white and grey on dark panels, one for each service: a brand board for Brands, a form and a page for Websites, a row of app screens and falling bars for Apps, a grid of tasks feeding a list for Automation, and three channels leading to a page for Growth.
The services’ drawings, stopped at one moment.

Three languages

Every page is in English, Italian and Spanish, each at an address of its own, and the site opens in the language of the reader’s browser.

In the CMS an article or a case study keeps its three languages side by side, one tab each.

Three phones with the home in English, Italian and Spanish: From the first sketch to the thousandth customer, Dal primo schizzo al millesimo cliente, Del primer boceto al cliente número mil.
The home in English, Italian and Spanish.
Four phones: the services with the Brands card, the Agents page, the blog with its search and an article.
The services, the agents, the blog and an article on a phone.

The blog

The blog is where the studio writes about its work: what a SaaS costs to build in 2026, how to audit a design system, what an MCP server is for. Every article is in the three languages, and a letter on the first of each month sends the past month’s articles to the readers who signed up.

Two browser windows: the blog index in the dark theme with its search and filters, and an article in the light theme with its cover and its contents beside it.
The blog and an article, in the two themes.

The covers

Every article gets a cover made by code. About half are drawings of the article’s idea in the style of its category: a dot screen for AI, black on paper for design, a blueprint for the web, a grey poster for business and an isometric board for infrastructure.

The rest are patterns and shaders in the same greys.

Fifteen article covers in five columns, one per category: dot screens for AI and Automation, black drawings on white for Product Design, blueprints for Web Design and Engineering, drawings on grey for Business and Scale, and isometric boards for Infrastructure and SEO.
Three covers from each category.
A wall of 194 small article covers in black, white and grey: drawings, flowing marble patterns, blurred shapes, curved tiles and geometric grids.
The covers of the first 194 articles.

The estimate

Start a project opens a few questions in place of a form: what you are trying to do, where you are with it, what the product needs and when you want to start. The estimate moves with every answer.

At the end the brief can be sent to the studio, or kept as a link to share with a team.

Four phones with the estimate: the first question with its choices, the parts of the product with a price each, the start date, and the brief with its estimate of 6,500 euros.
The questions, the estimate as it moves, and the brief.

The design system

The site is built on OS, my design system: the bar, the cards, the forms, the estimate’s steps and the footer are its parts, with Adamarant’s colour set once for all of them.

Three things are the site’s own: the paragraph that fills in as it is read, the list lit one line at a time, and the services that stack as you scroll.

Parts of the site on black: the bar, a case study card, an article card, the services as rows, a link to an article, the estimate’s steps in amaranth and the estimate’s bar.
Some of the parts the pages are built from.

The CMS

The studio runs the site from OS CMS: the case studies, the articles, the pictures, the messages and the briefs sent from the estimate. A case study can be read as a draft on its own page before it is published.

Signing in takes a second factor, and each person sees only the sections they are given.

The CMS list of articles: each title with its category, its status and the day it was published.
The articles in the CMS.
An article open in the CMS, with its English, Italian and Spanish tabs, its category and its cover, next to the same article on the site.
An article in the CMS next to its page.
A case study open in the CMS, with its facts and its three languages, next to the same case study on the site.
A case study in the CMS next to its page.
The CMS media library: a box to drop pictures into, a search, and the newest pictures as cards with their names and sizes.
The pictures, newest first.

Built with

Next.js · 16React · 19TypeScriptOSOS CMSSupabaseCloudflare R2Upstash RedisVercel

See it live at adamarant.com.

Start a project there to try the estimate.

Open adamarant.com

Have a project in mind?

I design and build complete digital products. If you’re planning something new, I’d like to hear about it.

Contact me