Brand & Visual Assets
Guidelines and assets for the juststeveking.com brand identity.
01. Logo
Download SVG
Light Mode
Dark Mode
Brand Accent
The monogram represents the intersection of technical precision and creative problem-solving. It should be used with ample clear space to maintain its visual impact.
02. Color Palette
Base
--color-bg #eff1f5 / #1e1e2e
Main background
Mantle
--color-bg-weak #e6e9ef / #181825
Secondary background
Crust
--color-bg-weak-hover #dce0e8 / #11111b
Tertiary background
Text
--color-text #4c4f69 / #cdd6f4
Primary body text
Subtext
--color-text-weak #8c8fa1 / #7f849c
Secondary text
Accent
--color-accent #8839ef / #cba6f7
Primary brand accent
Success
--color-success #40a02b / #a6e3a1
Success states
IC Track
--color-track-ic #df8e1d / #f9e2af
IC career track
03. Typography
A variable font family designed for user interfaces with a focus on high legibility of small-to-medium sized text.
The quick brown fox jumps over the lazy dog
The quick brown fox jumps over the lazy dog
The quick brown fox jumps over the lazy dog
Designed to illustrate the unique relationship between mankind and machine. Used for code, data, and metadata.
const brand = "juststeveking";
function designKit() { return true; }
ABCDEFGHIJKLMNOPQRSTUVWXYZ 0123456789
04. Visual Language
Radius
Rounded corners (0.75rem / 12px) are used across containers to convey a modern, approachable feel.
Borders
Subtle 1px borders using low-opacity variations of the text color define boundaries without visual noise.
Spacing
A strict spacing scale based on 4px increments ensures consistent rhythm and hierarchy.
Transitions
Smooth, 200ms transitions are applied to interactive elements for subtle feedback.