Gradiently Field Guide
Field Guide
Clear, practical guides to gradients, colour, brand identity and making things that look like you.
200 guides · 11 topics
Start here
Every guide
ColourColor theory basics for people who don't design
5 min read
You do not need art school to choose colours well. Six ideas explain almost every colour decision, and each one can be learned in a few minutes.
BrandingWhat is brand identity? The parts that actually matter
5 min read
A logo is the part of brand identity everyone talks about and the part people notice least. Here are all the pieces, what each one carries, and how they add up to being recognised.
Type and textText on gradient background: how to make it read every time
5 min read
A gradient changes under every letter, so a colour that reads at one end can vanish at the other. Here is the method that keeps words readable across the whole blend.
BackgroundsAesthetic backgrounds: how to make your own
5 min read
Downloaded backgrounds are shared by everyone who found the same page. Making your own takes an afternoon, and the result matches your phone, your desktop and your posts.
CSS and webCSS linear gradient: the complete guide to linear-gradient()
6 min read
Every part of linear-gradient() explained with a live example beside its code, from the default direction to hard stops, layered sheens and smoother OKLCH blends.
MotionAnimated gradient backgrounds for video and social
5 min read
An animated gradient can look like light moving through silk, or like a screensaver. The difference is a handful of design decisions you can make on purpose.
AI and designAI design tools: what they're good at, and where they fall short
6 min read
AI can give you fifty options before lunch. Whether any of them looks like your brand is another question. Here is how to tell the tools apart and judge them fairly.
Using GradientlyWhat is a Gradiently Mark? Living gradients, explained
6 min read
A Mark looks like a gradient background, but it behaves like a brand asset: a recipe drawn live, with a public code, a creator and exactly one owner.
Ideas and trendsGradient trends 2026: six directions worth using
7 min read
Gradients did not go away this year. They got quieter, grainier, darker and more personal. Here are the directions that hold up, each with a look you can copy.
GradientsLinear, radial, conic and mesh: every type of gradient explained
5 min read
Every gradient moves colour along a path. Change the path and you change the feeling. Here is each type, what it looks like, the code for it and the job it does best.
ColourHow to use a color wheel to choose a palette
5 min read
The colour wheel is the oldest tool in colour and still the most useful. Here is how to read one, why the painter's wheel and the screen wheel disagree, and how to turn it into a palette.
BrandingVisual identity vs brand identity vs logo
5 min read
Three terms that get used as if they meant the same thing. They don't, and the difference explains why a new logo so rarely fixes a brand that nobody recognises.
Social mediaInstagram post sizes: every format, and which to use
5 min read
Instagram accepts several shapes, but they don't all perform the same job. Here is every format, when to use each, how the profile grid crops them, and how to export so they stay sharp.
Type and textFont pairing: simple rules that work
5 min read
Two typefaces that look good alone can fight when they share a page. A few rules, and a handful of proven pairs, take the guesswork out of it.
BackgroundsPresentation backgrounds that don’t fight your slides
5 min read
Most slide backgrounds are chosen for the title slide and then suffer through forty content slides. Design a small family instead: loud where it can be, quiet where people need to read.
CSS and webCSS radial gradient: shapes, sizes and positions
5 min read
radial-gradient() draws colour outwards from a point. Here is every part of it, with live examples, plus the layering tricks behind soft glows, spotlights and vignettes.
MotionSeamless loop video: how to make one that never jumps
6 min read
A loop that jumps once every ten seconds is worse than no motion at all. The fix is not a better editor; it is motion designed to come home.
AI and designAI brand identity: what AI can make, and what needs you
5 min read
AI will happily give you a logo, a palette and a tagline before your coffee cools. Whether they add up to a brand is the part that is still your job.
Using GradientlyHow to find and claim a Mark
5 min read
Twenty thousand Marks, one of them right for you. Here is how to search the Market well, test a Mark on your own words, and make it yours.
Ideas and trendsGraphic design trends 2026 worth using, and how to use them
6 min read
Four big directions are shaping design this year. Each can make a brand feel current, and each can date it by next spring. Here is how to tell the difference.
GradientsMesh gradients: what they are and how to make one
5 min read
Mesh gradients are the soft, drifting colour fields behind half the launch pages you have seen this year. Here is how they work, how to build one by hand, and the two mistakes that ruin most of them.
ColourComplementary colors: contrast that still feels balanced
5 min read
Opposite colours give the strongest contrast colour can offer, and the quickest route to a design that hums or one that shouts. The difference is proportion and lightness.
BrandingHow to create a brand identity in a weekend
5 min read
You don't need three months and an agency to look like a real brand. You need two focused days, a clear order of decisions and the discipline to stop when it's good enough.
Social mediaInstagram Story size and safe zones
4 min read
A story fills the whole phone screen, and Instagram lays its own interface over the top and bottom. Here is the size, the zones to keep clear, and how to design inside them.