Picton Blue
Introducing Picton Blue (#47A1DE), a crisp and luminous cyan-blue. What sets it apart is its pure, digital-native feel, offering a clean brightness that feels both modern and energetic. This hue brings a sharp clarity to any interface.
What color is Picton Blue?
Picton Blue is a vivid, cool-toned blue with a noticeable cyan influence, giving it a fresh and airy quality.
It carries a clean character, sitting between a sky blue and a light azure, with subtle green undertones that prevent it from feeling too cold or deep.
What is the meaning of Picton Blue (#47A1DE)?
Picton Blue, with its hex code #47A1DE, often brings to mind feelings of calmness, clarity, and trustworthiness.
It symbolizes open communication and serenity, reminiscent of the clear skies and tranquil waters of its namesake, Picton, New Zealand.
How can I effectively use Picton Blue (#47A1DE) in my UI design?
In UI design, Picton Blue’s brightness makes it an excellent choice for primary calls-to-action, links, and interactive state indicators. It contrasts sharply against both light and dark neutral backgrounds, ensuring visibility. For color pairings, you can create a serene and professional palette with whites, charcoals, and soft grays. Alternatively, introduce a warm accent like a coral or soft yellow to build a more dynamic and playful interface.
While not a dominant color across the board, shades similar to Picton Blue are used effectively by brands like Headspace, Warby Parker, and Gopuff. Its presence in these applications suggests it's a solid choice for companies wanting to appear friendly, clear, and trustworthy without resorting to a more conventional corporate blue.
You can use the tools below to explore curated palettes, test color contrast for accessibility, and preview Picton Blue (#47A1DE) in real UI components from top brands.
Using Picton Blue color codes
To apply Picton Blue in your digital projects, the most direct method is using its hex code, #47A1DE. This code is the standard for specifying colors in HTML and CSS, making it simple to integrate into any web-based design.
Beyond the web, you may need to convert #47A1DE into other formats. For digital displays, the RGB model defines color through red, green, and blue light values. For print materials, the CMYK system uses cyan, magenta, yellow, and black ink percentages. Other models like HSL (Hue, Saturation, Lightness) offer a more intuitive way to make adjustments, as they align more closely with how humans perceive color.
To help you get started, we've converted Picton Blue's #47A1DE hex code into a full spectrum of popular color models. You can find and copy these values directly below.
Analogous
Analogous colors are found next to Picton Blue on the color wheel, creating a palette that feels exceptionally harmonious and composed.
Complementary
Complementary colors sit opposite each other on the color wheel. For Picton Blue, its complement creates a striking pairing with high visual contrast.
Split Complementary
A split complementary scheme offers a sophisticated alternative to a direct complement, pairing Picton Blue with the two colors adjacent to its opposite.
Triadic
A triadic color scheme uses three hues evenly spaced on the color wheel. Starting with Picton Blue, this creates a vibrant, high-contrast palette.
Tetradic
A tetradic color scheme creates a balanced yet dynamic palette by using two pairs of complementary colors, with Picton Blue as a base.
Square
A square color scheme pairs Picton Blue with three other colors, all equidistant on the color wheel, creating a vibrant and high-contrast palette.
Text Color
Background Color
Your Catchy Large Text Goes Here
Shades
Shades of Picton Blue are created by adding black, giving the color more depth and weight.
Tints
Tints are lighter versions of Picton Blue, created by adding white for a softer effect.
Tones
Tones are created by adding gray to Picton Blue, resulting in a softer, less saturated color.
Hues
Hues are variations of Picton Blue differing in intensity and temperature, which can alter a design's mood.
Never run out of inspiration again.
Use Mobbin for free as long as you like or get full access with any of our paid plans.































































































































