Style guide.
How Credited is put together, and where to change things. This page is hidden from search engines; delete it or keep it as a reference.
Make it yours
Your name
Edit the wordmark in the Navigation component, the name and handle in the hero, and the footer. The logo is the Mark inside the Logo frame in Navigation. Swap the avatar image in the hero's Profile avatar and in the Post, Question and DM booking instances.
The hero
Select Banner in the hero: Video (and a smaller phone video), Poster, Focus for the crop, and Drift. The bio, meta line and Followed by are plain text layers below it.
Case studies on Home
Work items with “Show on home” on appear as big captions, up to three. Each uses its Caption (words in [brackets] take the yellow), Video, Poster, Channel, Moment, Fact 1, Fact 2, Figure 1 and Editor.
Services scene
Select Reformat on Home. Its Items list holds each service's name, price, turnaround, shape, image and caption. Service pages come from the Services collection.
Column grid
Lives once in the Site layout template, behind every page. Change Columns, Margin and Colour there for each breakpoint. Pages and sections must stay transparent for the lines to show.
Accent words
Colour any word in a heading with the Accent style.
Messages
DM booking: set Form URL to an endpoint that accepts JSON, or nothing is sent. Contact page: set the form’s destination in its settings.
Colours
Page
#FFFFFF
Surface
#F4F4F6
Raised
#EBEBEE
Line
#E2E2E7
Ink
#0F0F11
Soft
#4F4F57
Muted
#6C6C75
Accent
#C2410C
On ink
#FFFFFF
Caption
#FFD15C
Other palettes to copy into Accent, with the logo and avatar fill beside it. Cobalt: #2347E6, logo #3157FF. Emerald: #047A55, logo #12B886. Violet: #5E3BF0, logo #7457FF.
Type: Be Vietnam Pro
Hero
We edit the posts people ask about.
Page title
Work.
Display 2
Creators we cut for.
Display 3
The line that made the clip.
Heading
Podcast clips
Lead
We cut YouTube videos, shorts and podcast clips for creators.
Body
The first frame is the thumbnail.
Prose
Long-form text in write-ups and notes.
Small
Turnaround 3 days
Label
Video editing studio
Figure
3.9M
Components
Post
The post on case pages. Plays the video while on screen and shows its counts.
Banner
The hero strip: a looping video that drifts on scroll. With reduced motion it stays on the poster.
Profile avatar
The hero avatar. As the page scrolls it flies into the logo in the navigation; the Logo frame carries the withNavLogo override.
Big caption
The clip's caption, huge over its video, lights up word by word on scroll, then the facts land. Pins inside a scene on Home; plays as it crosses the screen elsewhere.
Reformat, Credits, Follow
Reformat reshapes one shot through your services on scroll. Credits rolls film credits in the footer: edit its Rows in the Site template. Follow is the button on the Editors list on Studio.
Review
A long post trimmed with Show more. “Lines” sets where it cuts.
Question
Tap a question and its answer arrives as a reply.
DM booking
The closing message window. Opening messages, reply text and Form URL are controls.
Overrides
withViewportHeight (hero height); withNavLogo (the logo the profile avatar flies into); withSceneTrack, withSceneScreen (services scene); withStickyColumn (case pages); withCreditsTrack, withCreditsScreen, withCreditsCard (footer credits).
Button, Send button, Navigation
Canvas components. Button links to Contact; Send button carries the form’s Pending, Success, Error and Incomplete states.
Collections
Work
Case studies: the post, the caption, the facts and the write-up. Feeds the home captions and the Work pages.
Team
The editors on Studio, and who cut each case.
Creators
The creator cards on Home and Studio.
Services
The Services index and service pages.
Reviews
Long posts in “In their words”.
Questions
The questions on the home page.
Notes
The journal and note pages.