Minecraft Block Color Code Generator (Hex/RGB/HSL)
Pick a Minecraft block and instantly get perfect color codes with live preview and WCAG contrast. Copy hex/rgb/hsl, generate lighter/darker shades, and export CSS/Tailwind/JSON in one click.
———
Disclaimer: The Minecraft Color Code Generator Tool is not an official tool by Minecraft – it is created by fans to help Minecraft players & creators. We hope you like it and we do our best to update it regularly.
Minecraft Block Color Codes – Ultimate 50 Block Chart
| 🎨 Block & Color | 📝 Quick fact | 🔢 HEX | 🧮 RGB |
|---|---|---|---|
|
Emerald Block |
Trading vibes with villagers ✅ | #22B573 | rgb(34,181,115) |
|
Diamond Block |
Shiny and rare ✨ | #5DD9D9 | rgb(93,217,217) |
|
Gold Block |
Wealth & treasure 🪙 | #F2C14D | rgb(242,193,77) |
|
Iron Block |
Sturdy and common ⚙️ | #C8C8C8 | rgb(200,200,200) |
|
Copper Block |
Industrial build vibes 🔧 | #B87333 | rgb(184,115,51) |
|
Redstone Block |
Power & energy ⚡ | #D00000 | rgb(208,0,0) |
|
Lapis Lazuli |
Deep blue for enchanting 📘 | #1D3B8B | rgb(29,59,139) |
|
Netherite Block |
Strongest upgrade 🛡️ | #3C3C3C | rgb(60,60,60) |
|
Stone |
Classic survival block 🪨 | #7D7D7D | rgb(125,125,125) |
|
Deepslate |
Dark caves look ⛏️ | #4A4F52 | rgb(74,79,82) |
|
Quartz Block |
Clean white builds 🏛️ | #EDE6DF | rgb(237,230,223) |
|
Obsidian |
Portal power 🕶️ | #1A0F2B | rgb(26,15,43) |
|
Prismarine |
Ocean temples 🌊 | #5DAF9D | rgb(93,175,157) |
|
Dark Prismarine |
Turtle vibes 🐢 | #2E6B62 | rgb(46,107,98) |
|
Sea Lantern |
Underwater glow 💡 | #DDF6F4 | rgb(221,246,244) |
|
Grass Block |
Overworld surface 🌿 | #4E8B3D | rgb(78,139,61) |
|
Sand |
Desert builds 🏝️ | #E3D9A6 | rgb(227,217,166) |
|
Red Sand |
Mesa biome look 🧱 | #C96E3D | rgb(201,110,61) |
|
Ice |
Slippery surface ❄️ | #AEE3F5 | rgb(174,227,245) |
|
Amethyst Block |
Geode sparkle 🔮 | #9966CC | rgb(153,102,204) |
|
Sandstone |
Desert temples 🏜️ | #FFE8C2 | rgb(255,232,194) |
|
Jungle Wood |
Tropical builds 🌴 | #8A4B28 | rgb(138,75,40) |
|
Acacia Wood |
Orange planks 🌳 | #C77F4A | rgb(199,127,74) |
|
Dark Oak |
Dark forests 🌲 | #2E1B0F | rgb(46,27,15) |
|
Pink Wool |
Colorful builds 💖 | #F28BB2 | rgb(242,139,178) |
|
Black Wool |
Dark decor 🖤 | #1D1D1D | rgb(29,29,29) |
|
Yellow Wool |
Bright patterns 🌟 | #FFD700 | rgb(255,215,0) |
|
Cyan Wool |
Modern builds 🌀 | #00CED1 | rgb(0,206,209) |
|
Gray Wool |
Neutral tones 🧶 | #708090 | rgb(112,128,144) |
|
Orange Wool |
Hot decor 🧡 | #FF4500 | rgb(255,69,0) |
|
Leaves |
Tree canopy 🍃 | #228B22 | rgb(34,139,34) |
|
Cherry Leaves |
Sakura vibes 🌸 | #FFB6C1 | rgb(255,182,193) |
|
End Stone |
End dimension 🌌 | #FFFACD | rgb(255,250,205) |
|
Pink Concrete |
Modern pink 🏗️ | #FFD1DC | rgb(255,209,220) |
|
Light Blue Concrete |
Sky builds ☁️ | #87CEFA | rgb(135,206,250) |
|
Lime Concrete |
Neon builds 💚 | #90EE90 | rgb(144,238,144) |
|
Nether Brick |
Nether fortresses 🔥 | #8B0000 | rgb(139,0,0) |
|
Netherrack |
Hellish terrain 👹 | #B22222 | rgb(178,34,34) |
|
Moss Block |
Lush caves 🌱 | #556B2F | rgb(85,107,47) |
|
Slime Block |
Bouncy fun 🪀 | #00FF7F | rgb(0,255,127) |
|
Purple Concrete |
Royal style 👑 | #800080 | rgb(128,0,128) |
|
Magenta Wool |
Bright decor 💜 | #DA70D6 | rgb(218,112,214) |
|
Brown Wool |
Earthy tones 🟫 | #A0522D | rgb(160,82,45) |
|
White Wool |
Sheep favorite 🐑 | #F5F5DC | rgb(245,245,220) |
|
Blue Wool |
Ocean vibes 🌊 | #191970 | rgb(25,25,112) |
|
Carved Pumpkin |
Halloween 🎃 | #FFA500 | rgb(255,165,0) |
|
Terracotta |
Village builds 🏘️ | #FFDAB9 | rgb(255,218,185) |
|
Andesite |
Polished gray builds 🧱 | #A7A7A7 | rgb(167,167,167) |
|
Diorite |
Speckled white 🧂 | #E1E1E1 | rgb(225,225,225) |
|
Granite |
Warm stone mix 🧱 | #C27E6A | rgb(194,126,106) |
|
Packed Ice |
Fast slides 🧊 | #B0E0E6 | rgb(176,224,230) |
|
Blue Ice |
Fastest ice ⛸️ | #ADD8E6 | rgb(173,216,230) |
|
Melon |
Farm snack 🍉 | #98FB98 | rgb(152,251,152) |
|
Sea Pickle (lit) |
Subtle sea glow 🐠 | #7FFFD4 | rgb(127,255,212) |
|
Brick Block |
Classic walls 🧱 | #CD5C5C | rgb(205,92,92) |
|
Birch Planks |
Light wood 🪵 | #F5DEB3 | rgb(245,222,179) |
|
Spruce Planks |
Cozy cabins 🪓 | #8B4513 | rgb(139,69,19) |
|
Mangrove Planks |
Swamp builds 🐊 | #D2691E | rgb(210,105,30) |
|
Bamboo Mosaic |
Fresh green 🐼 | #7CFC00 | rgb(124,252,0) |
|
Cherry Planks |
Pastel wood 🌸 | #FFC0CB | rgb(255,192,203) |
|
Hay Bale |
Farm storage 🌾 | #EEE8AA | rgb(238,232,170) |
|
Bone Block |
Fossil look 🦴 | #FFFFE0 | rgb(255,255,224) |
|
Basalt |
Nether pillars 🌋 | #4B4E57 | rgb(75,78,87) |
|
Blackstone |
Gilded ruins 🗿 | #2B2E31 | rgb(43,46,49) |
|
Glowstone |
Warm light ✨ | #FBF5D0 | rgb(251,245,208) |
|
Beacon (light) |
Signal boost 🗼 | #00B7EB | rgb(0,183,235) |
|
Polished Deepslate |
Sleek dark slabs 🪨 | #708090 | rgb(112,128,144) |
|
Concrete Powder (Light) |
Soft texture 🧱 | #D3D3D3 | rgb(211,211,211) |
|
Scaffolding |
Build helper 🏗️ | #BDB76B | rgb(189,183,107) |
|
Shulker Box (Lime) |
Storage pop 📦 | #9ACD32 | rgb(154,205,50) |
|
Iron Bars |
Dungeons feel 🧲 | #C0C0C0 | rgb(192,192,192) |
|
Mud |
Swampy blocks 🪵 | #8F9779 | rgb(143,151,121) |
|
Podzol |
Taiga ground 🍂 | #7B3F00 | rgb(123,63,0) |
|
Granite Polished |
Smooth halls 🧭 | #BC8F8F | rgb(188,143,143) |
|
Stone Bricks |
Strong fort walls 🧱 | #9E9E9E | rgb(158,158,158) |
How this color tool works (and why it nails Minecraft tones)
This generator maps well-known blocks to clean, UI-ready color values. Pick a block, copy the HEX or RGB, and drop it into your design or website. Shades stay readable on dark backgrounds and provide enough contrast for buttons, badges, and charts. Use the swatch to preview, then copy with one click for instant consistency across your project.
Max’s scenario: matching his Minecraft overlay
Max is a Minecraft YouTuber who wants his stream overlay to feel “in-game”. He picks Emerald for success toasts, Obsidian for panel backgrounds, and Sea Lantern for subtle highlights. He copies the codes from the table and pastes them into his OBS/website styles to get a perfectly themed UI in minutes.
More Tools for creating Minecraft content:
• Idea Generator for Videos
• Title Generator
• Minecraft Banner Designer Tool
Turn these block colors into pro UI states
This section shows how to translate iconic Minecraft blocks into clear UI states for overlays, websites, or mod menus. Pick the block tone, keep the HEX/RGB consistent, and assign one color per meaning so users learn your signals fast.
| State | Suggested block | HEX | RGB | Why it works |
|---|---|---|---|---|
| Primary action ✅ | Emerald Block 💚 | #22B573 | rgb(34,181,115) | Trade/success association makes actions feel “win”. |
| Secondary action | Prismarine 🌊 | #5DAF9D | rgb(93,175,157) | Cool, calm tone that doesn’t steal focus. |
| Destructive ⚠️ | Redstone Block 🔴 | #D00000 | rgb(208,0,0) | Power & danger vibes signal risk at a glance. |
| Warning | Gold Block 🪙 | #F2C14D | rgb(242,193,77) | High visibility without harsh red. |
| Info | Lapis Lazuli 🔷 | #1D3B8B | rgb(29,59,139) | Classic “info blue” for tips and links. |
| Success | Grass Block 🌿 | #4E8B3D | rgb(78,139,61) | Natural green reads as “done”. |
| Disabled | Ice 🧊 | #AEE3F5 | rgb(174,227,245) | Frosted look suggests inactive controls. |
| Background | Stone 🪨 | #7D7D7D | rgb(125,125,125) | Neutral base with low visual noise. |
| Surface / Card | Quartz 🧼 | #EDE6DF | rgb(237,230,223) | Clean, light panels for content areas. |
| Elevated surface | Deepslate ⛏️ | #4A4F52 | rgb(74,79,82) | Subtle contrast for depth/shadows. |
| Accent | Amethyst 🔮 | #9966CC | rgb(153,102,204) | Eye-catching highlight for badges. |
| Focus ring | Sea Lantern 💡 | #DDF6F4 | rgb(221,246,244) | Bright edge that’s not aggressive. |
Ship a palette in minutes
Create a tiny design token set like --mc-primary:#22B573, --mc-danger:#D00000, etc. Map each token to one block and reuse them in buttons, alerts, and charts for instant consistency.
Fast workflows for copying codes
Use this quick checklist to move from block choice to usable UI colors with minimal friction.
| Task | Action | Output example | Time-saver tip |
|---|---|---|---|
| Pick main color 🎯 | Select block that matches feature vibe | Emerald → #22B573 / rgb(34,181,115) |
Lock one primary for all screens. |
| Define hover | Lighten +10% | Emerald hover → #31D88D |
Keep deltas fixed across the app. |
| Define active | Darken −10% | Emerald active → #1A8957 |
Same rule for every color. |
| Choose backgrounds | Stone / Deepslate / Quartz | Base / raised / panel | Three layers are enough. |
| Set alerts | Redstone / Gold / Lapis | Error / warning / info | Never swap meanings. |
| Pick success | Grass or Emerald | Success badge | Use only one green family. |
| Accessibility | Contrast ≥ 4.5:1 | Emerald on dark passes | Test text on both themes. |
| Charts | Use block families | Emerald, Prismarine, Lapis | Avoid random rainbow mixes. |
| Dark theme | Prefer Deepslate/Netherite | Cards & modals | Reserve Quartz for light mode. |
| Export tokens | CSS variables | --mc-danger:#D00000 |
Share across web & overlays. |
Don’t mix meanings
Never reuse Redstone for neutral elements or Lapis for errors. Color meaning drift confuses users and tanks click confidence.
Design example: speed-build a themed HUD
Build a compact HUD with one primary (Emerald), one background (Deepslate), and two accents (Lapis for info, Gold for warnings). Keep typography white on dark, reserve Sea Lantern for focus rings and selection borders. This minimal set scales from overlays to settings pages without visual noise.
Need currency math for Marketplace planning? Try the tool Minecoin to Euro.
Looking for audience insights? Check out the stat page Minecraft players by country.
FAQ: Minecraft Block Color Codes
Are these colors exact Minecraft values?Should I use HEX or RGB?Do these colors work on dark and light themes?How do I keep accessibility high?Are Java and Bedrock colors different?Can I copy the palette as tokens?