Skip to content


Razorfrog’s brand is the collection of perceptions people have about our company. It is the big picture impression that is left on our customers and those who interact with us.

Razorfrog’s branding exists to differentiate our company from others in the marketplace, as well as connect with a target audience. It creates trust and recognition by communicating in a consistent way across all teams and channels.

This style guide is the visual translation of Razorfrog's mission, vision and values. It is the framework that specifies how to communicate the Razorfrog brand. The design assets presented within are the tangible visual elements that determine how our brand is perceived by, and how it interacts with, the world.

Brand Story

Razorfrog Web Design blends cutting-edge web development with a deep commitment to our community in the San Francisco Bay Area. We create responsive, accessible websites that elevate your brand and engage your audience. Our story goes beyond design; we strive to be leaders in fostering equality and cultural vibrancy through our work. Partner with us and let’s build an empowering web presence for your business.

Our Mission

Razorfrog creates joyful and innovative design solutions for a diverse ecosystem of San Francisco Bay Area small and medium-sized businesses, entrepreneurs and industry professionals. Since 2008 our multidisciplinary team of veteran design and development experts has harnessed the power of WordPress to craft beautiful, inclusive and memorable web experiences that foster community and cultivate trust. We aspire to build sustainable, long-term relationships with our clients by providing world class customer service and timely support.

Our Vision

Razorfrog is inspired to build a more accessible, supportive and compassionate world. We combine vital ideas with resilient technology to cultivate strategic, symbiotic relationships built on integrity and accountability. Our mindful creatives are committed to assisting them with their web accessibility conformance goals and remediation efforts. We’re continually improving upon our services to meet the needs of our rapidly evolving world.

Our Values

Razorfrog embraces kindness, inclusivity, diversity, empathy, authenticity, professionalism, integrity and respect. Our award-winning team values leadership, strives for equality, and takes personal responsibility and accountability for our actions. We seek to use our collective gifts to be of service to our communities and envision a more tolerant, prosperous and culturally vibrant world.

Color Palette

Razorfrog’s official palette is comprised of a variety of swatches, each functioning as an essential component to our brand’s web presence and print design materials.


RGB156 / 250 / 241


CMYK37 / 0 / 3 / 1

Very light turquoise used for row backgrounds and color gradients.

Bright Turquoise

RGB12 / 241 / 220


CMYK95 / 0 / 8 / 5

Vibrant turquoise used for select row backgrounds and color gradients.


RGB8 / 160 / 146


CMYK95 / 0 / 8 / 37

Primary turquoise used for Razorfrog's logo assets, headers and UI elements.

Medium Turquoise

RGB5 / 95 / 87


CMYK94 / 0 / 8 / 62

Bolder turquoise used for headers, gradients and UI elements.

Dark Turquoise

RGB4 / 47 / 43


CMYK91 / 0 / 8 / 81

Darkest turquoise used as a contrasting background color, headers and UI elements.

Deep Sky Blue

RGB0 / 155 / 253


CMYK100 / 38 / 0 / 0

Used for water surface color gradients.

Cerulean Blue

RGB1 / 83 / 223


CMYK99 / 62 / 0 / 12

Used for select headers and water surface color gradients.

Navy Blue

RGB3 / 4 / 94


CMYK96 / 95 / 0 / 63

Used for select headers and water surface color gradients.

Earth Gold

RGB214 / 161 / 81


CMYK0 / 24 / 62 / 16

Accent color inspired by fuschia water lilies' natural stamens coloration.

Rose Pink

RGB255 / 0 / 128


CMYK0 / 100 / 49 / 0

Accent color inspired by fuschia water lilies' natural petals coloration.

Electric Violet

RGB153 / 0 / 255


CMYK40 / 100 / 0 / 0

Accent color inspired by fuschia water lilies' natural petals gradation.

Rich Black

RGB2 / 7 / 12


CMYK83 / 41 / 0 / 95

Used for body copy, select headers and wherever ultra high color contrast ratios are desired.


RGB71 / 71 / 71


CMYK0 / 0 / 0 / 72

Used for navigation links and select body copy and backgrounds where contrast is desired.

Mid Gray

RGB189 / 189 / 189


CMYK0 / 0 / 0 /25

Used for some background rows where lower contrast is desired.

Light Gray

RGB248 / 248 / 248


CMYK0 / 0 / 0 / 2

Used for some background rows where the lowest contrast is desired.


RGB255 / 255 / 255


CMYK0 / 0 / 0 / 0

Used for backgrounds page titles, button text, and body copy on darker backgrounds.


Typography -- the visual art of creating written words -- is an essential building block of Razorfrog’s brand identity. Razorfrog utilizes the following defined typefaces for all content displayed on our website at

Primary Typeface: Object Sans

Object Sans is a contemporary type family that puts together the best qualities of Swiss neo-grotesks and geometric fonts. It’s a multifunctional workhorse designed to work best in any printed and on-screen contexts, including logo design, brand identities, websites, packaging, posters and headlines. The regular weight is carefully tuned for small sized body text.

H1 heading

H2 heading

H3 heading

H4 heading

a b c d e f g h i j k l m n o p q r s t u v w x y z
0 1 2 3 4 5 6 7 8 9 ! ? . , : ; ‘ “ ^ < >
@ # $ % & * ( ) [ ] { } / \ | _ + = - ~ `

How quickly daft jumping zebras vex.

The quick brown fox jumps over the lazy dog.

This is a paragraph that uses every single letter in the alphabet. Now, that doesn’t mean this can be a paragraph with no story, but it does mean that every single letter is used. You can make it as generic or fanciful as you’d like. You can talk about anything from quilts to jets to xylophones. Oh yeah, and you can use whatever language you want, from Afrikaans to Zulu.

Directions for use:
Object Sans is used as Razorfrog's primary typeface for all purposes: headers, body copy, footers and more. Various font weights help to provide contrast for headers and links. It is also to be used within our printed branding materials such as business cards, letterhead, and greeting cards.

View Object Sans at Pangram Pangram.

UI Elements


Razorfrog’s on-brand images help to convey our best practices, aspirations and moods. The following images have been selected to communicate Razorfrog’s values associated with our brand.


Razorfrog’s brand voice strongly impacts how our audience feels about our products and services. The following words and phrases depict our best practices, personality and what does and does not demonstrate the voice of our Razorfrog brand.

Words we like:

Our voice is inspired, approachable, inclusive, inviting, positive, considerate, compassionate, grounding, evolving, mindful, joyful, resilient, and fun. It aims to foster a tolerant, diverse, and empathetic community. We are creating designs in response to a social environment that requires better ideas, informed solutions, and intentional presence.

Words we don't like:

Inaccessible, poor quality, stale, tasteless, inflexible, unnecessary, boring, outdated, unoptimized, thoughtless, bad design, overly complicated.

Toggle light/dark mode

Back To Top