BarnumPT Help Center

Color Editor

Last Updated on
By Wynter Jones

The Color Editor in BarnumPT is an essential tool for Funnel Hackers and ClickFunnels 2.0 users who need precise control over their color selections. This feature allows you to adjust shades, tweak brightness, and create personal color palettes, ensuring your web designs are visually appealing and on-brand.

Image

Step 1: Open the Color Editor

After selecting a color from a webpage using BarnumPT, click the "Open" button to launch the Color Editor. This will bring up the editing interface where you can begin refining your chosen color.

Image

Step 2: Change the Color

In the Color Editor, use the color gradient tool to adjust the shade to your liking. For more precise adjustments, use the HSL (Hue, Saturation, Lightness) sliders to fine-tune brightness and saturation, allowing you to achieve the perfect hue for your project.

Image

Step 3: Copy to Clipboard

Once you've settled on a color, the Color Editor conveniently provides CSS color codes in HEX, RGB, and HSL formats. Click to copy any of these codes to your clipboard, making it easy to integrate your chosen color into your design workflow.

Image

Step 4: Use the Color Contrast Checker

Ensure your color choices are readable by using the contrast checker. This tool evaluates how your color stands against various background colors, checking both large and small text sizes. When the contrast indicator turns green, your color choice is confirmed to be accessible and readable for all users.

Image

Step 5: Explore Color Shades & Harmonies

The Color Editor also lets you view and copy different shades of your selected color. Additionally, explore color harmonies to find complementary colors that enhance your design's balance and appeal. These options provide inspiration and help in building cohesive color palettes.

Image

Step 6: Save the Color

After fine-tuning your color, save it as a new color for future use. This feature ensures you have quick access to your customized palette for subsequent projects, maintaining consistency in your brand's visual identity.

Image

Additional Tips

  • Experiment with Harmonies
    • Use the color harmonies feature to experiment with different combinations to find the most visually pleasing balance for your project.
  • Regularly Check Contrast
    • Always use the contrast checker when selecting colors for text and backgrounds to ensure your designs are accessible to all users, including those with visual impairments.
  • Organize Saved Colors
    • Keep your saved colors organized by naming them according to their use case (e.g., "Brand Primary," "CTA Background") to streamline your design process.

Need Help?

Don't worry if something's not quite right or you get stuck! Our team is here to help you.

We have a small team so you may have to wait a moment for a response.