{"record":{"id":"9a9a8c2882bb006d","repo":"remotion-dev/remotion","slug":"name-must-be-a-hex-color-such-as-000000","errorCode":null,"errorMessage":"\"${name}\" must be a hex color such as \"#000000\"","messagePattern":"\"(.+?)\" must be a hex color such as \"#000000\"","errorType":"validation","errorClass":"TypeError","httpStatus":null,"severity":"error","filePath":"packages/brand/src/effects/metallic-swirl-effect.ts","lineNumber":313,"sourceCode":"\nconst assertOptionalEnum = <T extends string>(\n\tvalue: unknown,\n\tname: keyof MetallicSwirlParams,\n\tvariants: readonly T[],\n): void => {\n\tif (value === undefined) {\n\t\treturn;\n\t}\n\n\tif (typeof value !== 'string' || !variants.includes(value as T)) {\n\t\tthrow new TypeError(`\"${name}\" must be one of ${variants.join(', ')}`);\n\t}\n};\n\nconst parseHexColor = (hex: string, name: keyof MetallicSwirlParams): Rgb => {\n\tconst match = /^#?([a-f\\d]{2})([a-f\\d]{2})([a-f\\d]{2})$/i.exec(hex);\n\tif (!match) {\n\t\tthrow new TypeError(`\"${name}\" must be a hex color such as \"#000000\"`);\n\t}\n\n\treturn [\n\t\tparseInt(match[1], 16) / 255,\n\t\tparseInt(match[2], 16) / 255,\n\t\tparseInt(match[3], 16) / 255,\n\t];\n};\n\nconst validateMetallicSwirlParams = (\n\tparams: MetallicSwirlParams = {},\n): void => {\n\tassertParamsObject(params, 'Metallic swirl');\n\tassertOptionalFiniteNumber(params.time, 'time');\n\tassertOptionalFiniteNumber(params.speed, 'speed');\n\tassertOptionalFiniteNumber(params.zoom, 'zoom');\n\tassertOptionalFiniteNumber(params.iterations, 'iterations');\n\tassertOptionalFiniteNumber(params.sampleGap, 'sampleGap');","sourceCodeStart":295,"sourceCodeEnd":331,"githubUrl":"https://github.com/remotion-dev/remotion/blob/78fe4bb3fdb5a2cd68724393d63cb223db333fa7/packages/brand/src/effects/metallic-swirl-effect.ts#L295-L331","documentation":"`parseHexColor` runs on `resolved.colorA`, `resolved.colorB`, and `resolved.backgroundColor` after `resolve()`. It requires a `#RRGGBB` hex string (with or without the leading `#`, case-insensitive, exactly 6 hex digits). The regex `/^#?([a-f\\d]{2})([a-f\\d]{2})([a-f\\d]{2})$/i` rejects 3-digit shorthand, `rgba()`, named colors, and `#RRGGBBAA`.","triggerScenarios":"`metallicSwirl({colorA: 'red'})`, `metallicSwirl({colorA: '#fff'})` (3-digit), `metallicSwirl({backgroundColor: 'rgb(0,0,0)'})`, `metallicSwirl({colorA: '#ff0038ff'})` (8-digit), `metallicSwirl({colorA: '00000x'})`.","commonSituations":"Using 3-digit shorthand from design tokens; passing CSS named colors; alpha-channel hex (`#RRGGBBAA`); color picker outputs that default to rgb()/hsl() strings.","solutions":["Expand to 6-digit hex: `'#fff'` → `'#ffffff'`.","Convert named colors and rgb()/hsl() strings to `#RRGGBB` before passing.","Strip any alpha channel into the separate `opacity` field.","Validate with the same regex at your input boundary."],"exampleFix":"// before\nmetallicSwirl({colorA: '#fff', backgroundColor: 'black'});\n\n// after\nmetallicSwirl({colorA: '#ffffff', backgroundColor: '#000000'});","handlingStrategy":"validation","validationCode":"// Validate / normalize color strings to #RRGGBB before passing.\nconst HEX6 = /^#?([a-f\\d]{6})$/i;\nconst toHex6 = (v: unknown): string => {\n  if (typeof v !== 'string') {\n    throw new Error('color must be a string');\n  }\n  const trimmed = v.trim();\n  if (HEX6.test(trimmed)) {\n    return trimmed.startsWith('#') ? trimmed : `#${trimmed}`;\n  }\n  // expand 3-digit shorthand\n  const short = /^#?([a-f\\d]{3})$/i.exec(trimmed);\n  if (short) {\n    const [, d] = short;\n    return `#${d.split('').map((c) => c + c).join('')}`;\n  }\n  throw new Error(`color must be #RRGGBB hex, got ${JSON.stringify(v)}`);\n};\nmetallicSwirl({colorA: toHex6(raw.colorA)});","typeGuard":"const isHex6Color = (v: unknown): v is string =>\n  typeof v === 'string' && /^#?[a-f\\d]{6}$/i.test(v.trim());","tryCatchPattern":null,"preventionTips":["Use 6-digit hex (`#RRGGBB`) for all color params; expand 3-digit shorthand.","Convert named colors, rgb()/hsl() strings to hex at your boundary.","Move alpha into the separate `opacity` field, not an 8-digit hex.","Configure color pickers to output hex format."],"tags":["brand","metallic-swirl","validation","color","hex"],"backgroundTag":null,"analyzedSha":"78fe4bb3fdb5a2cd68724393d63cb223db333fa7","analyzedAt":"2026-08-12T17:18:50.444Z","schemaVersion":2},"datasetVersion":"2026-08-13T19:17:28.613Z"}