Articles
Practical guides on CSS, color, and design for developers and designers.
How to Build a Consistent Brand Color Palette from Scratch
A step-by-step guide to choosing your primary brand color, generating harmonies, checking WCAG contrast, and exporting CSS variables — using free PixCode tools at every step.
RAL vs Pantone vs HEX: which color system should you use and when
A complete, honest comparison of RAL, Pantone and HEX color systems. Understand their technical foundations, use cases, and how to choose the right one for your project.
The Complete CSS Shadow Guide: box-shadow, drop-shadow, and text-shadow explained
Master all three CSS shadow techniques. Learn the differences, parameters, real-world patterns, and performance tips with live examples.
CSS Glassmorphism in 2025: the right way to implement it
How to implement glassmorphism in 2025: backdrop-filter, WCAG contrast, performance on mobile, progressive fallback. The updated guide with real best practices.
px, rem, em, vh: When to Use Each CSS Unit
A practical guide to CSS units: when to use px, rem, em, vh, and vw. Includes an accessibility-first explanation and a quick conversion reference table.
How to extract a color palette from any image (and use it in your design)
Eyedropper vs. automatic extraction, dominant colors vs. representative colors, and a practical workflow for turning any photo or mood board into a usable design system — with free PixCode tools.
SVG vs PNG vs WebP: the definitive guide for web designers in 2025
The honest comparison of SVG, PNG, and WebP for every use case: logos, icons, photography, illustrations, favicons, and email. Includes when SVG wins despite larger file size and when WebP makes PNG obsolete.
CSS Gradients: The Complete Guide from Linear to Conic
Master all three CSS gradient types — linear, radial, and conic — with advanced color stops, angles, hints, and real patterns like striped backgrounds, gradient text, and mesh gradients.
HEX to RGB: The Complete Conversion Guide
Learn how to convert HEX color codes to RGB values manually and with tools. Understand the math, practical use cases, and when to use each format in CSS.
Color Palette Generator: How to Build Harmonious Color Schemes
Discover how to generate professional color palettes using color theory. Learn complementary, analogous, triadic schemes and how to apply them in UI design.
PX to REM: The Developer's Guide to Scalable Typography
Master CSS unit conversion from px to rem. Learn why rem units improve accessibility, how to calculate them, and best practices for responsive typography.
Color Contrast: WCAG Guidelines for Accessible Design
Learn how to check and fix color contrast ratios for WCAG 2.1 AA/AAA compliance. Tools, formulas, and practical tips for accessible UI design.
CSS Gradient Generator: Complete Guide to Linear and Radial Gradients
Master CSS gradients: linear, radial, and conic. Learn syntax, color stops, angles, and creative techniques for backgrounds, buttons, and UI elements.
HEX to RAL: Converting Digital Colors to Industrial Standards
Learn how to convert HEX colors to RAL codes for printing, painting, and manufacturing. Understand Delta-E accuracy and when digital-to-physical color matching matters.
Favicon Generator: Complete Guide to Browser Icons
Create perfect favicons for all browsers and devices. Learn the required sizes, formats (ICO, PNG, SVG), and HTML tags for modern favicon implementation.
Tints and Shades: Building Color Scales for Design Systems
Learn how to generate tints and shades from a base color to build professional design system color scales. Covers HSL manipulation, accessibility, and Tailwind-style palettes.
Aspect Ratio Calculator: Understanding Width-to-Height Ratios
Master aspect ratios for video, images, and responsive design. Learn 16:9, 4:3, 1:1 ratios, how to calculate dimensions, and CSS aspect-ratio property.
Font Pairing Guide: How to Combine Typefaces Effectively
Learn the principles of font pairing: contrast, hierarchy, and readability. Discover classic combinations, Google Fonts pairs, and how to apply them in web design.
CSS Box Shadow: Complete Guide with Examples
Master CSS box-shadow: syntax, multiple shadows, inset shadows, and creative effects. Learn elevation systems, neumorphism, and performance tips.
CSS Border Radius: Shapes, Blobs, and Creative Corners
Explore CSS border-radius from simple rounded corners to complex blob shapes. Learn the 8-value syntax, elliptical corners, and creative UI techniques.
Glassmorphism CSS: How to Create Glass Effect UI
Learn how to implement glassmorphism in CSS: backdrop-filter, blur, transparency, and border tricks. Includes browser support, performance tips, and accessibility.
CSS Text Shadow: Effects, Neon, and Typography Tricks
Master CSS text-shadow: syntax, multiple shadows, neon glow, emboss effects, and readable text on images. Creative typography techniques for modern web design.
Neumorphism CSS: Soft UI Design Technique Explained
Understand and implement neumorphism in CSS using dual box-shadows. Learn color requirements, accessibility issues, and when to use this design trend responsibly.
SVG to PNG: When and How to Convert Vector to Raster
Learn when to use SVG vs PNG, how to convert between them, and the implications for quality, file size, and performance. Includes resolution and DPI considerations.
Image to Base64: Encoding Images for CSS and HTML
Understand Base64 encoding for images: how it works, when to use it in CSS data URIs and HTML, size trade-offs, and browser caching implications.
Lorem Ipsum: History and Use in Modern Web Design
Explore the origins of Lorem Ipsum placeholder text, why designers use it, alternatives for realistic prototyping, and best practices for content-first design.
Base64 Encoding: What It Is and When to Use It
Deep dive into Base64 encoding: the algorithm, character set, padding, use cases in web development (data URIs, JWT, APIs), and common misconceptions.
JSON Formatter: Validate, Format, and Understand JSON
Learn JSON syntax, common validation errors, formatting best practices, and how to use JSON in APIs, config files, and web development workflows.
Unix Timestamp: Understanding and Converting Epoch Time
Understand Unix timestamps, Epoch time, and how to convert between timestamp and human-readable dates. Essential knowledge for API development and debugging.
Unit Converter: Length, Weight, Temperature and More
Master unit conversions for everyday and scientific use: metric vs imperial, temperature formulas, length, weight, and area. Includes quick reference formulas.
CSS Filter: Blur, Brightness, and Image Effects Explained
Master CSS filter functions: blur, brightness, contrast, grayscale, hue-rotate, saturate, and more. Learn to create Instagram-like filters and hover effects.
Color Blindness in UI Design: Accessible Color Choices
Design for color blindness: understand deuteranopia, protanopia, tritanopia, and how to test and fix your UI for the 8% of men affected. Tools and practical tips.
The Psychology of Color in UI Design: What the Research Actually Says
Most articles on color psychology repeat vague generalizations. This one cites real studies — red urgency, blue trust, green action — and applies them to practical UI design decisions.