Our brand styles define the visual identity and typography that creates a consistent experience.
Wordmark
Wordmark Variants
.png){kind=logo}
.png){kind=logo}
App Icons
Typography
Headings
text-4xl md:text-6xl lg:text-6xl font-medium tracking-tight text-gray-900
The future of process management
text-3xl md:text-4xl font-medium tracking-tight text-gray-900
Build better workflows together
text-2xl font-medium text-gray-900
Streamline your operations
text-xl font-medium text-gray-900
Enhanced team collaboration
text-lg font-medium text-gray-900
Project management made simple
text-base font-medium text-gray-900
Feature highlights and details
Paragraph Text
text-lg text-gray-600
Blue is designed to adapt to your team's unique workflow. Whether you're managing complex projects or simple tasks, our platform provides the flexibility and power you need to succeed.
text-base text-gray-600
Create custom fields, automate workflows, and collaborate in real-time. Our intuitive interface makes it easy for teams to get started while providing advanced features for power users.
text-sm text-gray-600
Perfect for captions, metadata, and secondary information that supports your main content.
text-base text-gray-900
Use darker text for primary content and important information that needs to stand out from secondary text.
Call Out Text
text-3xl text-gray-900 text-center
Our mission is to organize the world's work by building the best process management platform on the planet.
Color Palette
Features Grid
Features Grid Component
features-grid-simple component with optional URLs, Font Awesome icons, and responsive 3-column layout
Platform capabilities showcase
Performance
Lightning-fast response times and 99.9% uptime guarantee for mission-critical work.
Integration
Connect with 5,000+ tools including Slack, Gmail, Zapier, and custom APIs.
Mobile
Full-featured mobile apps for iOS and Android with offline sync capabilities.
Collaboration
Real-time collaboration tools with comments, mentions, and team workspaces.
Customization
Fully customizable interface, fields, and workflows to match your business needs.
Support
24/7 expert support with live chat, phone, and dedicated success managers.
Card Components
Standard Card
bg-white border border-gray-200 rounded-xl p-8 shadow-sm hover:shadow-md transition-shadow
Help & support
Have questions about features, experiencing issues, or want to share feedback? We're here to help.
support@blue.ccInsights Card
cursor-pointer group with h-64 image, title, category and date
AI Auto Categorization
Custom Permissions Engineering
Kanban Best Practices
Large Cards
cursor-pointer group with h-80 image, larger text, 2-column grid
Advanced Workflow Automation
Enterprise Security Features
Grid Layouts
2x2 Grid with Dividers
grid grid-cols-1 md:grid-cols-2 gap-0 with border-b border-gray-200 md:border-r
Product Grid
Full width 2x2 grid with dividers separating product features
Project Management
Organize your team's tasks and track project progress from start to finish.
Team Collaboration
Enable seamless communication and real-time collaboration across your entire team.
Workflow Automation
Automate repetitive tasks and streamline your processes to save time and reduce errors.
Analytics & Reports
Get detailed insights and comprehensive reports to make data-driven decisions.
Client Logo Grid
logo-grid template with JSON data for customer logos
Trusted by more than 17,000 teams
Image Styles
Product Screenshots
border-2 border-gray-200 rounded-lg shadow-[0_4px_6px_-1px_rgba(0,0,0,0.1),0_2px_4px_-1px_rgba(0,0,0,0.06)]
Team Photos
rounded-3xl for warm, friendly team imagery
Video Styles
Hero Videos
w-screen h-auto object-cover rounded-2xl with autoplay muted loop playsinline controls
Product Feature Video (Right)
feature-video component with text left, video right, optional "See also" section
Enhanced team collaboration
See your work your way with multiple views, real-time updates, and seamless collaboration tools. Switch between Kanban boards, calendars, timelines, and more to match your team's workflow.
See also
- Project management views Learn about different ways to visualize your work
- Real-time collaboration How teams work together in Blue
- Custom workflows Create custom workflows for your team
Product Feature Video (Left)
feature-video component with video left, text right, without "See also" section
Powerful automation workflows
Create sophisticated automations without code using our visual workflow builder. Connect tools, trigger actions based on custom conditions, and save hours of manual work every week.
Testimonials
Customer Video Testimonials
testimonial-videos component with 4x1 grid
"Blue just helps keep things completely organised — it's an absolutely wonderful tool."
"The automation features of Blue help us run our operations seamlessly."
"My entire life is in Blue! I love how fantasticly responsive the team is."
"If you're wondering if you should buy Blue...the answer is YES."
Side-by-Side Written Testimonials
Two-column layout with vertical divider
"Blue has transformed how we manage our global consulting projects. The automation features have saved us countless hours and improved our client delivery significantly."
"The flexibility and power of Blue's platform has enabled us to standardize processes across our entire organization while maintaining team autonomy."
Grid Testimonials
Three-column grid with light grey cards
"Blue has completely transformed our project management workflow. The intuitive interface and powerful automation features have made our team 3x more productive."
"The white-label capabilities of Blue have been instrumental in scaling our client services. We can now deliver enterprise-grade solutions with our own branding."
"We've saved hours every week using Blue's automation tools. The ROI has been incredible - it paid for itself within the first month of implementation and it just keeps getting better."
Stats
Stats Section Component
stats-section component with title and stats array
Leading companies trust Blue to streamline their operations
Call to Actions
Dual Button CTA
dual-button-cta component with title and two action buttons
Ready to get back to work? Ready to get started?
News Bar CTA
news-bar component with announcement text and button
Blue Design System 2.0 is now available with enhanced components and dark mode support.
Career Call to Action
bg-gray-50 rounded-3xl with centered content
Join us in shaping a future of technology
View careersInteractive Feature Showcase
Left Position (Default)
Position: "left" - Menu on left, preview on right
Explore platform capabilities (Left)
Right Position
Position: "right" - Menu on left with right-aligned text, preview on right
Team collaboration features (Right)
Top Position
Position: "bottom" - Menu grid first (top), preview second (bottom) - responsive: 1 col mobile, 2 tablet, 3 desktop
Bottom Position
Position: "top" - Preview first (top), menu grid second (bottom) - responsive: 1 col mobile, 2 tablet, 3 desktop
Analytics dashboard (Bottom)