Update app.py

app.py

@@ -74,13 +74,19 @@ def compare_tokenizers(tokenizer_index, text):
     tokens_display = [token.encode('utf-8').decode('utf-8') if isinstance(token, bytes) else token for token in tokens]
 
     # Prepare the results to be displayed in HTML format
-    tokens_html = "".join([f"<span style='background-color:#f0f0f0; padding:4px; margin:2px; border-radius:3px; border:1px solid #ccc;'>{token}</span>" for token in tokens_display])
-    encoded_html = "".join([f"<span style='background-color:#e0f7fa; padding:4px; margin:2px; border-radius:3px; border:1px solid #00acc1;'>{token}</span>" for token in encoded_output])
-    decoded_html = f"<div style='background-color:#e8f5e9; padding:10px; border-radius:3px; border:1px solid #4caf50;'>{decoded_text}</div>"
+    tokens_html = "".join([
+        f"<span style='background-color:#eeeeee; color: #333333; padding:4px; margin:2px; border-radius:3px; border:1px solid #cccccc;'>{token}</span>" 
+        for token in tokens_display
+    ])
+    encoded_html = "".join([
+        f"<span style='background-color:#e0e0e0; color: #000000; padding:4px; margin:2px; border-radius:3px; border:1px solid #aaaaaa;'>{token}</span>" 
+        for token in encoded_output
+    ])
+    decoded_html = f"<div style='background-color:#f5f5f5; color: #444444; padding:10px; border-radius:3px; border:1px solid #999999;'>{decoded_text}</div>"
 
     results_html = f"""
     <div style='font-family: Arial, sans-serif;'>
-        <h3 style='color: #00796b;'>Tokenizer: {tokenizer_name}</h3>
+        <h3 style='color: #2e7d32;'>Tokenizer: {tokenizer_name}</h3>
         <p><strong>Tokens:</strong> {tokens_html}</p>
         <p><strong>Encoded:</strong> {encoded_html}</p>
         <p><strong>Decoded:</strong> {decoded_html}</p>