tintify: tweak color intensity

app/soapbox/utils/__tests__/colors-test.js

@@ -9,8 +9,8 @@ describe('tintify()', () => {
     expect(result).toEqual({
       '100': '#e6f3fb',
       '200': '#c0e0f5',
-      '300': '#9bcdef',
-      '400': '#4fa8e4',
+      '300': '#4fa8e4',
+      '400': '#369be0',
       '50': '#f2f9fd',
       '500': '#0482d8',
       '600': '#0475c2',

app/soapbox/utils/__tests__/tailwind-test.js

@@ -20,8 +20,8 @@ describe('toTailwind()', () => {
           50: '#f2f9fd',
           100: '#e6f3fb',
           200: '#c0e0f5',
-          300: '#9bcdef',
-          400: '#4fa8e4',
+          300: '#4fa8e4',
+          400: '#369be0',
           500: '#0482d8',
           600: '#0475c2',
           700: '#0362a2',
@@ -53,7 +53,7 @@ describe('toTailwind()', () => {
           100: '#e6f3fb',
           200: '#c0e0f5',
           300: '#ff0000', // <--
-          400: '#4fa8e4',
+          400: '#369be0',
           500: '#0482d8',
           600: '#0475c2',
           700: '#0362a2',
@@ -77,8 +77,8 @@ describe('fromLegacyColors()', () => {
         50: '#f2f9fd',
         100: '#e6f3fb',
         200: '#c0e0f5',
-        300: '#9bcdef',
-        400: '#4fa8e4',
+        300: '#4fa8e4',
+        400: '#369be0',
         500: '#0482d8',
         600: '#0475c2',
         700: '#0362a2',
@@ -90,8 +90,8 @@ describe('fromLegacyColors()', () => {
         50: '#f3fbfd',
         100: '#e7f7fa',
         200: '#c3ecf4',
-        300: '#9fe1ed',
-        400: '#58cadf',
+        300: '#58cadf',
+        400: '#40c2da',
         500: '#10b3d1',
         600: '#0ea1bc',
         700: '#0c869d',
@@ -115,8 +115,8 @@ describe('fromLegacyColors()', () => {
         50: '#f2f9fd',
         100: '#e6f3fb',
         200: '#c0e0f5',
-        300: '#9bcdef',
-        400: '#4fa8e4',
+        300: '#4fa8e4',
+        400: '#369be0',
         500: '#0482d8',
         600: '#0475c2',
         700: '#0362a2',
@@ -127,8 +127,8 @@ describe('fromLegacyColors()', () => {
         50: '#f4fdf3',
         100: '#eafae7',
         200: '#caf4c3',
-        300: '#aaed9f',
-        400: '#6bdf58',
+        300: '#6bdf58',
+        400: '#55da40',
         500: '#2bd110',
         600: '#27bc0e',
         700: '#209d0c',
@@ -151,8 +151,8 @@ describe('expandPalette()', () => {
         50: '#f2f9fd',
         100: '#e6f3fb',
         200: '#c0e0f5',
-        300: '#9bcdef',
-        400: '#4fa8e4',
+        300: '#4fa8e4',
+        400: '#369be0',
         500: '#0482d8',
         600: '#0475c2',
         700: '#0362a2',
@@ -171,8 +171,8 @@ describe('expandPalette()', () => {
         50: '#f2f9fd',
         100: '#e6f3fb',
         200: '#c0e0f5',
-        300: '#9bcdef',
-        400: '#4fa8e4',
+        300: '#4fa8e4',
+        400: '#369be0',
         500: '#0482d8',
         600: '#0475c2',
         700: '#0362a2',
@@ -187,8 +187,8 @@ describe('expandPalette()', () => {
         50: '#f2f9fd',
         100: '#e6f3fb',
         200: '#c0e0f5',
-        300: '#9bcdef',
-        400: '#4fa8e4',
+        300: '#4fa8e4',
+        400: '#369be0',
         500: '#0482d8',
         600: '#0475c2',
         700: '#0362a2',
@@ -199,8 +199,8 @@ describe('expandPalette()', () => {
         50: '#f4fdf3',
         100: '#eafae7',
         200: '#caf4c3',
-        300: '#aaed9f',
-        400: '#6bdf58',
+        300: '#6bdf58',
+        400: '#55da40',
         500: '#2bd110',
         600: '#27bc0e',
         700: '#209d0c',

app/soapbox/utils/colors.ts

@@ -103,8 +103,8 @@ export default function(baseColor: string): TailwindColorObject {
     50: 0.95,
     100: 0.9,
     200: 0.75,
-    300: 0.6,
-    400: 0.3,
+    300: 0.3,
+    400: 0.2,
     600: 0.9,
     700: 0.75,
     800: 0.6,