그 당시에는 1337 명의 아이들이 모두 대화방에서 텍스트 페이더를 사용했습니다. 나는 너희들에 대해 모른다. 그러나 나는 그들이하는 것처럼 시원하게 느끼고 싶다. 유일한 문제는 이전 스크립트와 응용 프로그램이 만들어진 소프트웨어에 크게 연결되어 있기 때문에 원하는 곳에서이 놀라운 기능을 사용할 수 없다는 것입니다. 또한 솔루션을 쉽게 이식 할 수 있기를 원하므로 플로피 디스크에 맞게 코드를 최대한 작게 만들어야합니다 (플로피 디스크는 한 개만 가지고 있지만 소스 코드가 너무 큰 경우 나는 하나 이상을 운반 할 수 있습니다 : P ).

입력

• 색상 목록 (rgb, hex, names 등)
• 서식을 지정할 텍스트

프로그램은 색상 목록에 최소한 2 개의 색상이 포함되어 있어야합니다.
형식화 할 텍스트는 0보다 길 수 있으며 문자는 인쇄 가능한 ASCII로 제한됩니다. (힌트 : 텍스트를 길게 입력하면 연속 문자에 중간 색상을 재사용해야 할 수 있습니다)

산출

출력 텍스트는 글꼴 및 / 또는 마크 업 / 스타일 이외의 방식으로 입력 텍스트와 다르지 않아야합니다 (참고 : 출력에 html 마크 업이 포함 된 경우 입력을 html 인코딩해야합니다). 마크 업 / 스타일링 (html 스타일 태그, 콘솔 색상 등) 또는 희미한 텍스트 그림이있는 텍스트를 출력 할 수 있습니다. 입력에이 요구 사항을 충족시키기에 충분한 문자가 포함되어 있지 않으면 모든 색상 헥스가 출력에 있어야합니다. 이 경우 우선 순위 규칙을 참조하여 출력에 표시 할 색 헥스를 결정하십시오. 출력의 순서 또는이 색상은 여전히 ​​입력 순서 여야합니다.

색상 우선 순위 규칙

1. 입력이 하나의 문자 인 경우 첫 번째 색상이 사용됩니다
2. 문자가 두 개인 경우 첫 번째 색과 마지막 색이 사용됩니다
3. 문자보다 3 개 이상의 색상과 더 많은 색상이있는 경우 첫 번째 색상과 마지막 색상이 우선 순위를 정한 다음 나머지 색상은 입력 된 순서대로 지정해야합니다.
4. 색상보다 많은 문자가있는 경우 중간 색상을 사용하여 문자가 한 색상에서 다음 색상으로 페이드되어야합니다.

예 (각각 우선 순위 규칙 1-3) :
# 색상 | 색 ₀ | ... | 색 _n | 텍스트
3 ff0000 0000ff ffff00 M-> -> ->
3 ff0000 0000ff ffff00 hi
4 ff0000 0000ff ffff00 0fff00 sup

명확하게하려면 텍스트 색상이 한 색상 16 진에서 다음 16 진으로 페이드되어야합니다. 페이드가 완벽하게 균일 할 필요는 없지만 멋지게 페이드 할 수있는 문자가 충분하지 않은 한 급격한 색상 변경이어서는 안됩니다. 일반적으로이 페이드는 작업해야하는 문자 수와 색의 차이에 의해 결정된 간격으로 rgb 값을 증분 / 감소시켜 각 문자에 대한 중간 색을 선택함으로써 달성됩니다. 예를 들어 (# ff0000)과 (# 000000) 사이에 단일 색상이 필요한 경우 중간에 올바르게 배치되도록 선택할 수 있습니다 . 최적의 출력은 다소 예쁘게 보입니다.

예 (우선 순위 규칙 4) :
3 ff0000 ff7f00 f0ff00 To be or not to be, that is the question...-> -OR-

<span style="color:#ff0000;">T</span><span style="color:#ff0600;">o</span><span style="color:#ff0c00;"> </span><span style="color:#ff1200;">b</span><span style="color:#ff1800;">e</span><span style="color:#ff1e00;"> </span><span style="color:#ff2400;">o</span><span style="color:#ff2a00;">r</span><span style="color:#ff3000;"> </span><span style="color:#ff3600;">n</span><span style="color:#ff3c00;">o</span><span style="color:#ff4300;">t</span><span style="color:#ff4900;"> </span><span style="color:#ff4f00;">t</span><span style="color:#ff5500;">o</span><span style="color:#ff5b00;"> </span><span style="color:#ff6100;">b</span><span style="color:#ff6700;">e</span><span style="color:#ff6d00;">,</span><span style="color:#ff7300;"> </span><span style="color:#ff7900;">t</span><span style="color:#ff7f00;">h</span><span style="color:#fe8500;">a</span><span style="color:#fe8b00;">t</span><span style="color:#fd9100;"> </span><span style="color:#fc9700;">i</span><span style="color:#fb9d00;">s</span><span style="color:#fba400;"> </span><span style="color:#faaa00;">t</span><span style="color:#f9b000;">h</span><span style="color:#f9b600;">e</span><span style="color:#f8bc00;"> </span><span style="color:#f7c200;">q</span><span style="color:#f6c800;">u</span><span style="color:#f6ce00;">e</span><span style="color:#f5d400;">s</span><span style="color:#f4da00;">t</span><span style="color:#f4e100;">i</span><span style="color:#f3e700;">o</span><span style="color:#f2ed00;">n</span><span style="color:#f1f300;">.</span><span style="color:#f1f900;">.</span><span style="color:#f0ff00;">.</span> 

귀하의 답변에 출력을 표시하는 방법을 지정하십시오 (html, 콘솔, 이미지 등).

^{* 모든 검정색 배경은 색상을 강조하기위한 것이며 필수는 아닙니다}

채점

이것은 code-golf 이므로 가장 짧은 답변 (바이트)이 이깁니다.
개별 캐릭터에 페이드를 추가하면 영원히 멋지다고 생각합니다 (그러나 일부 언어에서는 불공평하므로 점수를 매기는 보너스는 없습니다)

자바 스크립트 (ES6), 290 바이트

h=a=>f(a,a.shift());f=
(a,w)=>[...w].map((c,i)=>{l=w.length-1;m=a.length-1;s=o.appendChild(document.createElement('span'));s.textContent=c;s.style.color=`#${i?i-l?a[r=l%m,n=l/m|0,i<r*n+r?++n:i-=r,k=i/n|0,k++].replace(/./g,(c,d)=>((parseInt(c,16)*(n-i%n)+i%n*parseInt(a[k][d],16))/n|0).toString(16)):a[m]:a[0]}`;})

<textarea rows=10 cols=40 oninput="o.textContent='';h(this.value.split`\n`)">Type the text here and the colours on subsequent lines.
FF0000
00FF00
0000FF</textarea><div id=o>

Pyth, 126 바이트

직접 산술 평균 대신 필수 루트 평균 제곱 평균입니다.

L%"<span style=\"color:#%s\">%s</span>",smt.H+256s*255@d2ebhbMm+hG*-eGhGcdHH=Q^RL2Q+smsyMC,hdCgRlhdCedC,ctlQPzC,QtQy,ez?tlzeQh

온라인으로 사용해보십시오!

샘플 출력 :

자바 702 662 글자

골프 두 가지 기능 :

import java.awt.*;String f(Color C,char c){return"<span style=\"color:#"+Integer.toHexString(C.getRGB()).substring(2)+";\">"+c+"</span>";}String c(String t,String[]h){String r="";int l=h.length,e=t.length(),i=0,s=0,g=1,c=-1,p,q,u;double d,m=0,v;char[]T=t.toCharArray();Color C[]=new Color[l],H[],a,b;for(;i<l;)C[i]=Color.decode(h[i++]);if(l>e){H=java.util.Arrays.copyOfRange(C,0,e);H[e-1]=C[l-1];H[0]=C[0];C=H;l=e;}d=--e/(l-1.);for(;++c<e;){a=C[s];b=C[g];p=b.getRed()-a.getRed();q=b.getGreen()-a.getGreen();u=b.getBlue()-a.getBlue();v=m/d;r+=f(new Color(a.getRGB()+((int)(v*p)<<16|(int)(v*q)<<8|(int)(v*u))),T[c]);if(++m>d){m-=d;s=g++;}}return r+f(C[l-1],T[e]);}

아무도 이것을 읽을 수 없으므로 클래스에 ungolfed 버전의 두 함수가 있습니다.

import java.awt.*;

public class Q80554 {

    static String format(Color color, char character) {
        return "<span style=\"color:#" + Integer.toHexString(color.getRGB()).substring(2) + ";\">" + character + "</span>";
    }

    static String colorizeB(String text, String[] hexColors) {
        String result = "";
        int colorsLength = hexColors.length, textLength = text.length(), i, currentStartColorPos = 0, currentGoalColorPos = 1, currentCharPos = -1, diffColorRed, diffColorGreen, diffColorBlue;
        double difference, goneDifference = 0, relativeChange;
        char[] textArray = text.toCharArray();
        Color colors[] = new Color[colorsLength], changer[], currentStartColor, currentGoalColor;

        for (i = 0; i < colorsLength;)
            colors[i] = Color.decode(hexColors[i++]);

        if (colorsLength > textLength) {
            changer = Arrays.copyOfRange(colors, 0, textLength);
            changer[textLength - 1] = colors[colorsLength - 1];
            changer[0] = colors[0];

            colors = changer;
            colorsLength = textLength;
        }

        // fade
        difference = --textLength / (colorsLength - 1.); // space between colors    

        for (; ++currentCharPos < textLength;) {
            currentStartColor = colors[currentStartColorPos];
            currentGoalColor = colors[currentGoalColorPos];

            diffColorRed = currentGoalColor.getRed() - currentStartColor.getRed();
            diffColorGreen = currentGoalColor.getGreen() - currentStartColor.getGreen();
            diffColorBlue = currentGoalColor.getBlue() - currentStartColor.getBlue();

            relativeChange = goneDifference / difference;

            result += format(new Color(currentStartColor.getRGB() + ((int) (relativeChange * diffColorRed) << 16 | (int) (relativeChange * diffColorGreen) << 8 | (int) (relativeChange * diffColorBlue))), textArray[currentCharPos]);

            if (++goneDifference > difference) {
                goneDifference -= difference;
                currentStartColorPos = currentGoalColorPos++;                   
            }
        }

        // last character always has last color
        return result + format(colors[colorsLength - 1], textArray[textLength]);
    }
}

여기에는 자신의 코드에 대한 상한이 있습니다. 사용법은 colorize(또는 골프 버전의 c )를 호출 하여 텍스트와 16 진 색상 코드 배열을 전달하는 것입니다. 이 함수는 OP처럼 HTML 태그가 포함 된 문자열을 반환하므로 HTML을 렌더링하는 방법이 필요합니다.

질문처럼 보이는 알고리즘이 더 쉽습니다. 첫 번째 문자는 항상 첫 번째 색을, 마지막 문자는 항상 마지막 색을 가져옵니다. 텍스트에 문자보다 많은 색상이 있으면 텍스트와 색상을 반복하여 적용합니다. 재미있는 부분은 페이드가있는 부분입니다. 텍스트에서 색상이 어느 거리에 있는지 알아내는 것으로 시작했습니다. 기본적으로 두 가지 색상 사이의 빨강, 녹색 및 파랑 차이를 계산 한 다음 문자가 색상 사이의 위치에 따라 첫 번째 색상에이 차이의 일부를 추가합니다. 두 색상의 간격을 벗어나면 다음 두 색상으로 새로 시작합니다. 이것은 우리가 알고있는 마지막 문자를 제외한 모든 문자에 대해 반복되며 항상 마지막 색상입니다. 이것은 매우 아름다운 페이딩을 제공합니다.

그 질문은 매우 재미있었습니다! 감사!

업데이트

이제 모든 경우를 특별히 다루지는 않습니다. 대신 두 개가 많으면 색상을 자르고 페이드 기능을 모든 문자열에 적용합니다. 텍스트보다 많은 색상이 있으면 색상이 잘리고 페이딩 기능이 간단한 매핑처럼 작동합니다.