なでしこスクリプトをhtmlに変換するツールを投稿してきました
https://n3s.nadesi.com/id.php?2670

正規表現でなでしこのプログラムをチョキチョキして、htmlを出力するツールです
できあがったhtmlはブログに貼ってね

でも正規表現もhtmlも知識があやしい
ついでに色彩感覚もあやしい
UIもあやしい

どんな仕上がりになるとうれしいとか、ゆるく意見をいただきたいです。
思い付きでOK。

とりあえず出力はpreタグとcodeタグで囲っているのですが、カッコイイ枠線とか付けたいです

以下ここにhtml貼ったらどうなるかテスト

<pre style="background-color:#FFEEFF"><code>
<span style="color:green">/*
　　区切りとカラーリングのテスト
*/</span>
<span style="color:blue">単語</span><span style="color:magenta">=</span><span style="color:magenta">[</span><span style="color:magenta">]</span><span style="color:green">//コメント文</span>

<span style="color:red">1</span><span style="color:black">から</span><span style="color:red">3</span><span style="color:black">の</span><span style="color:#7f00ff">配列連番作成</span><span style="color:black">して</span><span style="color:magenta">反復</span>
　　<span style="color:magenta">対象</span><span style="color:black">の</span><span style="color:#7f00ff">乱数</span><span style="color:black">を</span><span style="color:blue">単語</span><span style="color:black">に</span><span style="color:#7f00ff">配列追加</span>
<span style="color:magenta">ここまで

</span><span style="color:red">3</span><span style="color:magenta">回</span>
　　<span style="color:#7f00ff">回数</span><span style="color:black">を</span><span style="color:#7f00ff">表示</span>
　　<span style="color:magenta">続ける</span>
<span style="color:magenta">ここまで

</span><hr><strong><span style="color:magenta">●関数テスト</span></strong>
　<span style="color:red">100</span><span style="color:magenta">+</span><span style="color:red">1</span><span style="color:black">を</span><span style="color:magenta">戻す</span>
<span style="color:magenta">ここまで

</span><span style="color:green">//区切りのテスト</span>
<span style="color:red">10円</span><span style="color:black">と</span><span style="color:red">10個</span><span style="color:black">を</span><span style="color:#7f00ff">掛</span><span style="color:black">けて</span><span style="color:#7f00ff">表示</span>
<span style="color:maroon">「あいう」</span><span style="color:black">が</span><span style="color:#7f00ff">かなか判定</span><span style="color:black">して</span><span style="color:#7f00ff">ください</span>
<span style="color:magenta">もし</span><span style="color:blue">で</span><span style="color:black">が</span><span style="color:blue">なら</span><span style="color:black">なら</span><span style="color:blue">はた</span><span style="color:black">は</span><span style="color:#7f00ff">はい</span> <span style="color:green">//もし出が奈良なら旗ははい</span>
<span style="color:#7f00ff">終わり</span></code></pre>