Portfolio Personal UI Gradient: Slate → Cyan (Minimal-ink)
A professional slate-cyan gradient palette designed for portfolio personal interfaces. This minimal-ink style color scheme is optimized for modern web and mobile applications, providing excellent contrast and visual appeal.
Preview · The Contextual Visualizer
Overview
Switch templates to see this palette in Admin Dashboard, Pricing Page, and Mobile Profile contexts.
Accessibility & Contrast
Real-time Contrast
Design Intent & Use Cases
- •Minimal canvas to keep projects and screenshots dominant
- •Crisp accent for links and contact actions
- •High readability for case study pages
Color Psychology
Ink-dark palettes feel confident and modern, especially for creators who want their work to speak for itself. The sky accent adds clarity and 'clickability' without turning the whole site into a neon billboard.
Best Usage Context
Use the accent for links, active navigation states, and the main contact CTA (Email me / Book a call). Keep project cards neutral so thumbnails and screenshots stay the focal point.
Accessibility & Contrast
Light ink text on deep backgrounds is a safe baseline for reading. The sky-blue button uses dark text for strong contrast, making the primary CTA readable even at smaller sizes.
Color Palette
Gradient Presets
linear-gradient(135deg, #0F172A 0%, #334155 50%, #38BDF8 100%)radial-gradient(circle at center, #38BDF8 0%, #334155 50%, #0F172A 100%)Copy & Use
:root {
--color-primary: #0F172A;
--color-accent: #38BDF8;
--bg-page: #020617;
--bg-surface: #0F172A;
--border-color: #1E293B;
--text-primary: #F8FAFC;
--text-secondary: #CBD5E1;
--button-primary-bg: #38BDF8;
--button-primary-text: #020617;
--button-secondary-bg: #1E293B;
--button-secondary-text: #E2E8F0;
}Best for
✓Best for
- Designer portfolios
- Developer personal sites
- Case study pages
- Consultant landing pages
✕Not recommended for
- Highly playful lifestyle aesthetics
- Colorful illustration-heavy brands