Skip to content

Commit

Permalink
teak saturation multipliers for more random values
Browse files Browse the repository at this point in the history
  • Loading branch information
@RodrigoLuglio
RodrigoLuglio committed Oct 10, 2024
1 parent 1f74854 commit 829ec0a
Show file tree
Hide file tree
Showing 2 changed files with 36 additions and 32 deletions.
65 changes: 33 additions & 32 deletions src/lib/generator/uiColors.ts
View file
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
import Color from 'color'

import { randomInteger } from '@/lib/utils/math'
import { randomInteger, randomNumber } from '@/lib/utils/math'
import { ensureReadability, generateSchemeColors } from './colorUtils'
import { ColorScheme } from '@/lib/types/colors'
import type { UIColors, ThemeGenerationOptions } from '@/lib/types/colors'
Expand All @@ -24,8 +24,8 @@ export function generateThemeColors(

const schemeHues = generateSchemeColors(baseHue, scheme)

const bgBase = isDark ? randomInteger(0, 25) : randomInteger(75, 100)
const fgBase = isDark ? randomInteger(75, 100) : randomInteger(0, 25)
const bgBase = isDark ? randomInteger(0, 25) : randomInteger(85, 100)
const fgBase = isDark ? randomInteger(75, 100) : randomInteger(0, 10)

const generateColor = (
hue: number,
Expand Down Expand Up @@ -54,82 +54,83 @@ export function generateThemeColors(
initialColors.BG1 ||
generateColor(
schemeHues[randomInteger(0, schemeHues.length - 1)],
uiSaturation * 0.1,
uiSaturation * randomNumber(0, 1),
isDark ? bgBase + randomInteger(0, 5) : bgBase - randomInteger(0, 2)
),
BG2:
initialColors.BG2 ||
generateColor(
schemeHues[randomInteger(0, schemeHues.length - 1)],
uiSaturation * 0.15,
uiSaturation * randomNumber(0, 1),
isDark ? bgBase + randomInteger(0, 9) : bgBase - randomInteger(0, 5)
),
BG3:
initialColors.BG3 ||
generateColor(
schemeHues[randomInteger(0, schemeHues.length - 1)],
uiSaturation * 0.2,
uiSaturation * randomNumber(0, 1),
isDark ? bgBase + randomInteger(0, 13) : bgBase - randomInteger(0, 7)
),
FG1:
initialColors.FG1 ||
generateColor(
schemeHues[randomInteger(0, schemeHues.length - 1)],
uiSaturation * 0.45,
uiSaturation * randomNumber(0, 1),
isDark ? fgBase - randomInteger(0, 7) : fgBase + randomInteger(0, 9)
),
FG2:
initialColors.FG2 ||
generateColor(
schemeHues[randomInteger(0, schemeHues.length - 1)],
uiSaturation * 0.45,
uiSaturation * randomNumber(0, 1),
isDark ? fgBase - randomInteger(3, 15) : fgBase + randomInteger(3, 15)
),
FG3:
initialColors.FG3 ||
generateColor(
schemeHues[randomInteger(0, schemeHues.length - 1)],
uiSaturation * 0.05,
uiSaturation * randomNumber(0, 1),
isDark ? bgBase + randomInteger(0, 5) : bgBase - randomInteger(0, 5)
),
AC1:
initialColors.AC1 ||
generateColor(
schemeHues[randomInteger(0, schemeHues.length - 1)],
uiSaturation * 1.2,
uiSaturation * randomNumber(1, 1.5),
isDark ? 60 : fgBase + randomInteger(0, 40)
),
AC2:
initialColors.AC2 ||
generateColor(
schemeHues[randomInteger(0, schemeHues.length - 1)],
uiSaturation * 1.1,
uiSaturation * randomNumber(1, 1.5),
isDark ? 65 : fgBase + randomInteger(0, 50)
),
BORDER:
initialColors.BORDER ||
generateColor(
schemeHues[randomInteger(0, schemeHues.length - 1)],
uiSaturation * 0.2,
uiSaturation * randomNumber(0, 1.2),
isDark ? bgBase + 10 : bgBase - 10
),
INFO:
initialColors.INFO || generateColor(210, uiSaturation, isDark ? 65 : 45), // Blue spectrum
initialColors.INFO ||
generateColor(210, uiSaturation * randomNumber(0, 1.5), isDark ? 65 : 45), // Blue spectrum
ERROR:
initialColors.ERROR ||
generateColor(0, uiSaturation * 1.2, isDark ? 65 : 35), // Red spectrum
generateColor(0, uiSaturation * randomNumber(0, 1.5), isDark ? 65 : 35), // Red spectrum
WARNING:
initialColors.WARNING ||
generateColor(30, uiSaturation * 1.1, isDark ? 65 : 35), // Orange spectrum
generateColor(30, uiSaturation * randomNumber(0, 1.5), isDark ? 65 : 35), // Orange spectrum
SUCCESS:
initialColors.SUCCESS ||
generateColor(120, uiSaturation * 0.9, isDark ? 40 : 25), // Green spectrum
generateColor(120, uiSaturation * randomNumber(0, 1.5), isDark ? 40 : 25), // Green spectrum
lineHighlight:
initialColors.lineHighlight ||
Color(
generateColor(
schemeHues[randomInteger(0, schemeHues.length - 1)],
uiSaturation * 0.3,
uiSaturation * randomNumber(0, 1),
isDark ? bgBase + 5 : bgBase - 5
)
).hex() + '70',
Expand All @@ -138,7 +139,7 @@ export function generateThemeColors(
Color(
generateColor(
schemeHues[randomInteger(0, schemeHues.length - 1)],
uiSaturation * 0.4,
uiSaturation * randomNumber(0, 1),
isDark ? bgBase + 15 : bgBase - 15
)
).hex() + '70',
Expand All @@ -147,7 +148,7 @@ export function generateThemeColors(
Color(
generateColor(
schemeHues[randomInteger(0, schemeHues.length - 1)],
uiSaturation * 0.6,
uiSaturation * randomNumber(0, 1),
isDark ? bgBase + 20 : bgBase - 20
)
).hex() + '70',
Expand Down Expand Up @@ -213,19 +214,19 @@ export function updateThemeColorsWithSaturation(
const updatedColors: UIColors = { ...currentColors }

const saturationMultipliers = {
BG1: 0.1,
BG2: 0.15,
BG3: 0.2,
FG1: 0.05,
FG2: 0.1,
FG3: 0.05,
AC1: 1.2,
AC2: 1.1,
BORDER: 0.2,
INFO: 0.2,
ERROR: 1.2,
WARNING: 1.1,
SUCCESS: 0.9,
BG1: randomNumber(0, 1),
BG2: randomNumber(0, 1),
BG3: randomNumber(0, 1),
FG1: randomNumber(0, 1),
FG2: randomNumber(0, 1),
FG3: randomNumber(0, 1),
AC1: randomNumber(1, 1.2),
AC2: randomNumber(1, 1.2),
BORDER: randomNumber(0, 1),
INFO: randomNumber(0, 1.5),
ERROR: randomNumber(1, 1.5),
WARNING: randomNumber(1, 1.5),
SUCCESS: randomNumber(0, 1.5),
}

Object.keys(updatedColors).forEach((key) => {
Expand Down
3 changes: 3 additions & 0 deletions src/lib/utils/math.ts
View file
Original file line number Diff line number Diff line change
@@ -1,3 +1,6 @@
export function randomInteger(min: number, max: number) {
return Math.floor(Math.random() * (max - min + 1)) + min
}
export function randomNumber(min: number, max: number) {
return Math.random() * (max - min) + min
}

0 comments on commit 829ec0a

Please sign in to comment.