Stream: contributing

Topic: design tokens / brand guide


view this post on Zulip Georges Boris (Mar 04 2023 at 13:25):

hey folks - I was just wondering. do we have any design doc available for Roc? when we worked on advent of code stuff last year I noticed there were discrepancies between some pages and the style they were going for. I wonder if this is something anyone is interested. I think it could be useful to agree upon a few things as a community to make new projects easier to work on design-wise instead of having multiple directions based on personal taste (for things like official website / guide / blog / package docs)

view this post on Zulip Anton (Mar 04 2023 at 13:31):

There is no design doc that I'm aware of, but I'd love to have one :)

view this post on Zulip Richard Feldman (Mar 04 2023 at 16:10):

as in website design for roc-lang.org?

view this post on Zulip Anton (Mar 04 2023 at 16:13):

No, I think it is more like a style guide for the roc brand, so that we use a similar color palette and the same set of fonts everywhere.

view this post on Zulip Richard Feldman (Mar 04 2023 at 16:14):

ahh gotcha

view this post on Zulip Richard Feldman (Mar 04 2023 at 16:14):

yeah it's definitely not consistent everywhere :big_smile:

view this post on Zulip Richard Feldman (Mar 04 2023 at 16:14):

I think the tutorial should be the reference point

view this post on Zulip Richard Feldman (Mar 04 2023 at 16:15):

that is, https://www.roc-lang.org/tutorial

view this post on Zulip Richard Feldman (Mar 04 2023 at 16:15):

it's the most recent and up-to-date

view this post on Zulip dank (Mar 04 2023 at 16:20):

the builtins docs looks really nice imo

view this post on Zulip Georges Boris (Mar 04 2023 at 16:43):

yeah I personally love the colors/fonts of the built-in docs. the difference between them and the tutorial is what motivated me to ask here :grinning_face_with_smiling_eyes:

view this post on Zulip Richard Feldman (Mar 04 2023 at 17:05):

as in you prefer them to the tutorial?

view this post on Zulip Anton (Mar 04 2023 at 18:38):

The builtins style is nice but also a tad boring

view this post on Zulip Brendan Hansknecht (Mar 04 2023 at 18:39):

I think it is clean and has nicer colors than the tutorial.

view this post on Zulip Brendan Hansknecht (Mar 04 2023 at 18:40):

Though not for code examples

view this post on Zulip Brendan Hansknecht (Mar 04 2023 at 18:40):

The tutorial definitely has some code examples with real color

view this post on Zulip Brendan Hansknecht (Mar 04 2023 at 18:41):

But color for headers and links and such. I think the tutorial itself has colors that are too pale for example.

view this post on Zulip Georges Boris (Mar 04 2023 at 21:28):

yeah, I prefer the colors and fonts in the docs. the tutorial background is pure black (or almost), top header is missing roc's logo and the nice purple the docs has as well...

I have nothing against the edgier fonts on the tutorial - they remind me of Gleam's stuff which I really like. But I don't think personal taste should be discussed extensively since it is obviously subjective.

Maybe just a quick vote on which of the two directions to take? I can open a follow-up PR with proposed changes and short reference guide of colors to be discussed/approved.

view this post on Zulip Georges Boris (Mar 04 2023 at 21:29):

A) Apply tutorial colors and nav styles to docs.

view this post on Zulip Georges Boris (Mar 04 2023 at 21:29):

B) Apply docs colors and nav styles to tutorial.

view this post on Zulip Luke Boswell (Mar 04 2023 at 22:15):

C) Merge them somehow? Fonts from tutorial etc.

view this post on Zulip Luke Boswell (Mar 04 2023 at 22:15):

The relevant css is in www/build/site.css and www/build/styles.css. It looks like we are keeping www/build/homepage.css styled bare for now.

It would be nice to have a consistent styling applied everywhere. There was another issue/PR which someone had built design tokens for Roc, but I am having trouble finding it rn.

view this post on Zulip Richard Feldman (Mar 05 2023 at 01:54):

I'd be curious to see what the docs colors would look like in the tutorial

view this post on Zulip Richard Feldman (Mar 05 2023 at 02:08):

what do people think about 2 colors vs 1 in general? e.g. purple/teal vs all purple

view this post on Zulip Brendan Hansknecht (Mar 05 2023 at 02:41):

I think either works fine as long as we good nice bold colors

view this post on Zulip Anton (Mar 05 2023 at 08:41):

Similar to Luke's proposal, I would suggest starting with B and look into spicing things up afterwards.

view this post on Zulip Anton (Mar 05 2023 at 08:49):

what do people think about 2 colors vs 1 in general? e.g. purple/teal vs all purple

I'm a fan of multiple primary colors, that sparks more joy :)


Last updated: Jul 06 2025 at 12:14 UTC